Harmonic Theme logo issues
-
Hi – I love the Harmonic theme but I’ve had a few problems with it.
The main one at the moment is regarding the ‘logo’ idea. Is there any way one can edit the size and placement of the logo on the front page? At the moment it is appearing way too far to the left and too small. It also looks as if the opacity has been reduced, which I have most certainly not done. I am very inexperienced with code so I would appreciate any help! My site is http://www.mirandaostler.com, and I am using Safari 9.0.3 on a MacBook Pro. -
Have you been using this guide https://en.support.wordpress.com/site-logo/ ?
To see all the themes that are supported, check out the Site Logo filter https://wordpress.com/themes/filter/site-logo on the Theme Showcase. https://wordpress.com/themes
See here for details on purchasing the annually renewable Premium bundle http://store.wordpress.com/plans/premium/ that contains a custom design upgrade required for CSS editing: Custom design – Frequently Asked Questions
http://en.support.wordpress.com/custom-design/#frequently-asked-questions
http://en.support.wordpress.com/custom-design/
http://en.support.wordpress.com/custom-design/editing-css/
http://en.support.wordpress.com/custom-design/custom-fonts/Note 1: Once you have the required upgrade you can use this link https://en.forums.wordpress.com/forum/css-customization#postform so you can create a thread that will appear in the CSS Forum where you will get the help you need with CSS editing.
Note 2: You can also post there prior to purchasing an upgrade to get an answer to whether or not what you want to do can be accomplished via CSS editing.
-
Thank you timethief – I am actually already on the Premium bundle, so I will have a look at CSS!
-
-
Let me know if I can help with anything here.
To change the size, you can try something like this:
img.site-logo { max-width: 400px; }The element you’re currently targeting isn’t quite the right one. A browser inspector is a handy way to find the right element to target with CSS.
Keep in mind that Harmonic is designed to display the logo at no more than 250px wide. Enlarging it with CSS may make the logo look a bit jagged/pixillated, especially with a text-based logo like yours, so I’d recommend keeping it at the current size.
It also looks as if the opacity has been reduced, which I have most certainly not done.
The panel changes in opacity dynamically as you scroll, but you can override that with:
#slide-1 .hsContent { opacity: 1 !important; }If you let me know in what way you’d like to change the logo positioning I can help with that too.
-
-
-
Ooh. Sorry to bother you again, but I have just realised that the logo adjustment now means that on mobile (or on my iPhone at least) the logo is now directly over my face. How would I go about making it stay in the middle of the photo on a mobile device?
-
If you decide to restrict your changes to certain screen sizes, you can learn more about using media queries that target certain screen sizes here:
http://en.support.wordpress.com/custom-design/custom-css-media-queries/
http://webdesignerwall.com/tutorials/responsive-design-with-css3-media-queriesMedia queries are a simple concept but powerful in practice, and can take some experimentation and testing to get right.
-
- The topic ‘Harmonic Theme logo issues’ is closed to new replies.