-
AuthorPosts
-
June 18, 2013 at 7:57 pm #24988
Hi,
I hope someone can help. I have 2 questions, being new to this theme.
1) How do I change the background colour of an individual text block?
2) I have an image inserted in another location which I would like to be able to change on hover to be the same image but faded with text over.
Thanks
June 19, 2013 at 4:03 pm #125386Hi,
1.) Can you give us a link to your website? Did you place the text block inside a column? You can use this code, to change the background color.
.flex_column > .avia_textblock {
background: red;
}
First Text Block
.flex_column:first-child > .avia_textblock {
background: green;
}
Second Text Block
.flex_column:nth-child(2) > .avia_textblock {
background: blue;
}
Third Text Block
.flex_column:nth-child(3) > .avia_textblock {
background: pink;
}2.) This is a simple image hover effect. http://www.netmagazine.com/tutorials/create-modern-css3-hover-effects
Regards,
Ismael
June 20, 2013 at 7:04 pm #125387Hello,
Thanks for the advice, the code worked for the text block, but I guess what I probably needed instead was the background color for the column instead of the text block. How would I do that? I have a background image in the main content and would like to produce blocks of text but only on the front page. I realise that the color section would do this, but it can’t be a anything other than full width can it?
http://www.thequickstartguides.com
Thanks,
Wendy
June 20, 2013 at 7:20 pm #125388Hello again,
The tutorial on the hover is useful and kind of what I expected, however (and sorry if this is a really obvious answer but I am new to customising in wordpress) where can I access the html code for the home page? I know I can edit the css via style.css, but the html doesn’t show because of the Avia layout builder (which is awesome), and if I click on default editor there is nothing there??
Thanks again for your help,
Wendy
June 21, 2013 at 5:15 am #125389Hi,
You can switch the Advance Layout Editor to debug mode. This way you will see the actual shortcode below the Avia Builder. Edit functions.php then find this code.
if(isset($avia_config['use_child_theme_functions_only'])) return;
Below add this code
//set builder mode to debug
add_action('avia_builder_mode', "builder_set_debug");
function builder_set_debug()
{
return "debug";
}Go to your Advance Layout Editor and scroll below to see the actual shortcode.
Regards,
Ismael
-
AuthorPosts
- The topic ‘Background colour of text block and image change on hover’ is closed to new replies.