Hi there!
I’m making my way into WordPress by playing around with a child themes. I’m still a php beginner, and I can’t quite understand how to style a custom field with CSS.
This page is what I’m going for: http://demo.quarktheme.com/ -with the stacked, full-width colored divs.
The Developer wrote in support how he did it:
“I used Advanced Custom Fields to create some extra meta boxes for my posts that allowed me to select the background colours/image. I then modified my templates to create a full width container around each page with the id of the post. Lastly, within functions.php, I add css to the page head using the items selected in the extra meta fields for the background colour/image of each page “row”.”
I just need a little more explanation.
I’ve already got my custom fields ready in a template, I just don’t know how to style them.
I don’t know a whole lot about ACF, honestly, but those instructions seem a bit complicated! Reviewing the template you referenced, those are just divs with text and I’m not sure there’s a need for ACF to create that layout. Unless I’m misunderstanding, ACF is best used for additional information (fields) for display on a post or page, not just static text on an otherwise static page. The standard fields provided by WordPress can achieve this.
A good theme probably does not need to incorporate an outside WordPress plugins unless the template is designed for a custom business, such as a hotel booking site or something- or maybe a hero slider for the homepage. That’s my thoughts on that, unless I’m misunderstanding your overall goal.
Anyway, to answer your question, you would simply apply a class to the div you wrapped your custom fields in and add the CSS to style.css or custom.css (if available). Viola.
