-
Hi,
I’m using a child of the enlightnment theme, and I have 3 issues I need to sort out:
1) I need to change the logo image in the sticky header so that when the user scrolls down, rather than simply shrinking the default logo image, it will be replaced by a simplified version that looks much better in the reduced size. I’ve tried to use both jquery and classie.js to solve this problem, without success.
2) I managed to over-ride the default starting size for the logo with a small css snippet aimed at .navbar-brand .site-logo, but suddenly that stopped working and the logo is now loading at your default size even though I still have the exact same over-ride in the custom css panel???
3) Finally, I tried to copy EXACTLY the multicolumn media component that you describe in your documentation, but the images are coming in as tiny. I mean really tiny (20px), smaller even than standard sized icons. In fact, when I followed the instructions exactly, the images were not displayed at all. It was only when I set the image to left-align that they appeared on the page. But tiny.
Please help? I love the theme for the potential your own demo versions display, but even just to copy that basic funcionality has proven very tricky because your documentation doesn’t quite match reality…
I think that the issue is this: bootstrap.css over-rides any changes made in custom style.css file; I need to enqueue the changes so they’ll come in after bootstrap… How do I do this in a way that won’t be erased every time you update the theme?
The simplest way to achieve this is to use a custom CSS hack. Go to Appearance → Design → Custom CSS and enter the following:
@media (min-width: 992px) { .navbar-brand { background-image: url(/path/to/image.png); background-position: 15px 14px; background-repeat: no-repeat; background-size: auto 32px; } .navbar-large .navbar-brand { background: none; } .navbar-brand > .site-logo { opacity: 0; } .navbar-large .site-logo { opacity: 1; } }The only thing you need to change in the code above is replace the
/path/to/image.pngwith the real path to your logo. Because of the previous changes you made to your theme you may run into issues which unfortunately cannot be debugged unless you share a link to your website.
You must be logged in to reply to this topic.