-
AuthorPosts
-
November 12, 2013 at 10:48 pm #187494
Hi there
I am using the excellent Enfold theme on a website I am developing for a friend: http://www.alicemackintosh.com/
I have a couple of questions:
1.) On http://kriesi.at/themes/enfold/homepage/home-v4-small-slider/ you have a grey/black transparent background effect on the slider wording. Can you send me the CSS for this pls? I take I can put it in the Quick CSS box in Enfold Styling.
2.) What is the CSS to change the colours of the footer? Both where the widgets go and the copyright part.
Many thanks
NickNovember 12, 2013 at 10:51 pm #187496Hey Nick!
For the captions, add this CSS:
.ls-layer span { background: rgba(0, 0, 0, 0.5); padding: 20px !important; display: block; }
Regarding the footer, by colours you mean the font colours or the background colour?
Cheers,
JosueNovember 12, 2013 at 11:26 pm #187523Hey Josue, thanks for the quick response.
I have added this code and it works well, but how do I get padding on the right hand side, as currently the wording goes right to the edge of the image.
And I mean the actual background colours in the footer, currently grey.
Thanks
Nick
- This reply was modified 11 years, 1 month ago by nickgibbens01.
November 12, 2013 at 11:46 pm #187540Hi Nick!
The right padding is there, you just need to push the span to the left (try using a % value instead of a px one) in LayerSlider.
For the footer, use this:
#footer .flex_column{ background: red !important; padding: 0 20px; /* You may want to add some padding too */ }
Or if you want to have a different background color for each one:
#footer .flex_column:nth-child(1){ background: green !important; } #footer .flex_column:nth-child(2){ background: yellow !important; } #footer .flex_column:nth-child(3){ background: blue !important; } #footer .flex_column:nth-child(4){ background: peru !important; }
Cheers!
JosueNovember 13, 2013 at 10:59 pm #188036Thanks for this code Josue, I will try it out soon and let you know how I get on.
Another question, how do you get the slider to not show the wording (span) on a mobile (smaller) device? It just looks a tad silly on an iphone for example as the writing is so small. In this instance it would be good to just show the slider image.
Thanks
Nick
November 13, 2013 at 11:09 pm #188040Hey Nick!
This code will do it:
@media only screen and (max-width: 767px) { .ls-layer span { display: none !important; } }
Cheers!
JosueNovember 14, 2013 at 12:59 am #188113Thanks again for such a quick response, excellent service I must say. Just added thois code and works a treat. So bascially anything with a browser size that is below 767px will not show the wording on the slider? What is an Ipad or other standard tablet out of interest?
I have one further question, when you play around with the responsiveness of the theme, if you reduce the browser window to a certain size the navigation totally goes: see
Is this just an issue with the a desktop browser so effectively would never be an issue in the real world?
November 14, 2013 at 5:49 am #188219Hi!
Please edit js > avia.js, find this code on line 90:
switchWidth = 767; if(first_level_items > 7 + header.find('#menu-item-search').length && !bottom_menu) { switchWidth = 989; header.addClass('mobile_menu_tablet'); }
Replace it with:
switchWidth = 1006; if(first_level_items > 7 + header.find('#menu-item-search').length && !bottom_menu) { switchWidth = 1006; header.addClass('mobile_menu_tablet'); }
Remove browser cache then reload the page a few times.
Regards,
IsmaelNovember 20, 2013 at 11:06 pm #191169Hey there, thanks for the response. I have replaced the above with what you suggested, however it has not fixed the problem.
Any other ideas?
Thanks
Nick
November 21, 2013 at 2:07 am #191232Hey Nick!
That behavior is unexpected, it doesn’t happen neither in the demo nor in my local installation, try the following:
1. Disable all third-party plugins (some js may be conflicting).
2. Re-install the theme (backup any theme modification you’ve made first).Best regards,
JosueNovember 23, 2013 at 4:38 pm #192280Hey Josue, I will get back to you on the above soon, but going back to footer colours: the code you have given me changes the actual column colours. I’m looking to achieve this: http://www.alicemackintosh.com/wp-content/uploads/2013/11/alice-footer-colours-new.jpg
Any ideas?
November 24, 2013 at 4:58 am #192405Hey!
You can change those colors in Enfold > Styling:
Best regards,
JosueNovember 25, 2013 at 12:22 am #192665Ok that’s great, somehow missed that bit, but its great to have so much control from the backend.
Regarding “when you play around with the responsiveness of the theme, if you reduce the browser window to a certain size the navigation totally goes: see”
When I set Responsive Header Main Menu to “Display as slide out menu” the issue s fixed – see my website now. I.e it always shows the navigation. This is what the Enfold demo uses. But when its selected to “Display as Dropdown menu” it then gets lost at a certain browser size.
Have disabled plugins but this does not fix it.
Thanks
NickNovember 25, 2013 at 2:30 am #192717Hi,
Can you create an administrator account and post it here as a private reply?
Regards,
JosueDecember 13, 2013 at 9:08 pm #200079This reply has been marked as private.December 14, 2013 at 5:16 pm #200245Hi!
Please go to Users > Add New in WordPress dashboard and set the role as administrator and post username and password here privately
Cheers!
YigitDecember 16, 2013 at 9:48 pm #200785This reply has been marked as private.December 19, 2013 at 3:45 am #201833Hey!
Fixed: http://www.alicemackintosh.com/
I added this code to the Quick CSS:
.responsive .mobile_menu_tablet .main_menu { display: block !important; }
Cheers!
JosueDecember 21, 2013 at 8:46 pm #202916Thanks for all your help. Hopefully I have also helped you improve the theme as well.
Great support I must say :)
December 22, 2013 at 12:02 am #202940You are welcome, glad we could help.
Happy Holidays :)
Regards,
Josue -
AuthorPosts
- The topic ‘Slider text transparency’ is closed to new replies.