-
Posts
-
I’ve searched the forum, watched a couple of your videos and looked at the support documentation that came with the Enfold theme, but I still can’t find the answer to my question regarding alternate content.
I am wondering how to apply the alternate content settings to a page.
For example, if I divide a page into:
2/3 and 1/3 layout
How do I apply the “Main Content” settings to the 2/3 page column and
“Alternate Content” settings to the 1/3 page column.
What I would like to achieve is to have:
Left column 2/3 to be white background with black writing
Right column 1/3 to be red background with white writing.
I understand that I can set the colours in the theme styling. But I am unclear how I actually apply the styling to say, the right side of a page.
Thank you for your help.
Hi web4smallbusiness,
You can define a section as using the Alternate style by putting all of that content in a Color Section.
Regards,
Devin
Thanks your quick response Devin, however, that does not work.
If I add colour section and then choose the Alternate Content, it makes both the left hand column and right hand column the colour of the alternate content.
What I am after is a solution, where a left hand column, say 2/3 layout element has white background with black writing and the right hand column which is 1/3 layout black background with white writing.
I am trying to achieve something similar to what is on this page:
http://www.ceremonieswithstyle.com.au/faqs.htm
Left hand column is white with black writing
Right hand column is red with white writing
Perhaps alternate content is not the right solution for this, in which case I’m wondering how I can go about achieving a similar effect.
Hi,
You’re referring to the sidebar and the content?
#main .container_wrap .container {
background: black;
color: white;
}
.sidebar {
background: white;
color: black;
}Add the code on your custom.css or Quick CSS.
Regards,
Ismael
Thank you. But I do not use the sidebar on the right handside.
What I am referring to is when I create a page, which is divided into two sections. It can either be 1/2 and 1/2 or 2/3 and 1/3 or other.
I am interested in having the container on the left handside be one colour and the one on the right handside another colour
That is possible but it’ll take a few steps to get there. The first is to add this line to your functions.php file:
add_theme_support('avia_template_builder_custom_css');When you’ve done that, each of your avia elements in the advanced layout editor will now have a new field where you can add a custom class name for that specific element.
Now what you can do is add a class name for your element and easily add custom css to style it however you need it. For colors/fonts/backgrounds you can use !important without much worry because it will only effect your specific custom class name.
Its a good habit to use some kind of very specific prefix here to make sure it doesn’t clash with any of the theme class selectors. For example, I would use dv-my-custom-class { color: red} because its highlight unlikely Kriesi used my initials before any class selector in the theme css :)
Regards,
Devin
- The topic ‘Alternate Content’ is closed to new replies.