Relocated Logo in Sela
-
Hi there,
Sela requires my logo to be centered, but I would like it on the left side of my title–my logo is currently above my title. How can I move it?
Thank you!!!
The blog I need help with is: (visible only to logged in users)
-
Hi Deanna –
Try adding this code into the CSS area of your customizer:
.site-logo {
float: left;
margin: -2.5em 0 .5em 0;
padding: 0;
}.site-title {
font-size: 3.6rem;
line-height: 1.3333;
margin: -3.4em 0 0 0;
}Here is an article on how to do this:
https://en.support.wordpress.com/custom-design/editing-css/Note: you must have either WordPress.com Premium or WordPress.com Business active on your site to be able to add custom CSS to your site.
Let us know if this helps!
-Cat
-
Thank you so much Cat–this code did move it to the left, but it is still above my title. Now I need to move it down, any suggestions? Here is my site http://www.deannafossen.com
I truly appreciate your help!!!!
-
You’re welcome! Please keep in mind I am a volunteer and I do not have the access privileges of a Happiness Engineer.
I wonder if this code will get you there:
.site-logo {
float: left;
margin: -2.5em 0 .5em 0 !important;
padding: 0;
}.site-title {
font-size: 3.6rem;
line-height: 1.3333;
margin: -3.4em 0 0 0 !important;
}If you use the above code, it should in theory look like this: http://awesomescreenshot.com/0ec5zjsv1d
on a desktop.
I’m not sure how it would look on smaller devices, though. You could save the CSS code I gave you in your customizer then let me know by posting here so I can have a look with my web developer tools and advise you further. I have subscribed to this thread and will keep an eye out for your post.
Best,
-Cat
-
You are so awesome to be taking the time to help. It does look correct on the WordPress screen, but when I log directly into my site, the logo is still above my title. Even though I don’t have a clue what I am doing, I am playing with the numbers in the codes, lol :)
-
-
I got it!!!! Here are the changes I made to the logo portion :)
.site-logo {
float: left;
margin: -2.5em 0 -4.5em 0 !important;
padding: 0;
} -
-
-
-
-
lol, as my Dad used to joke, “I can speak any language except Greek.”
Me: “Ok, Dad, speak CSS.”
Dad: “Its Greek to me!”
-
Thank you for pointing that out, it doesn’t work on my phone. That must be why the logo is centered over the title :(
-
-
Hi Deanna – I looked at your site again and it seems that you must have taken the custom CSS out. Is that because it wasn’t working for you on your phone? If so, I completely understand!
There is additional CSS that can be added to target mobile devices.
However, it might be easier for you to switch your theme to one such as this:
https://tortugademo.wordpress.com/where the logo image can easily be placed to the left and the site title/description is to the right.
If the Toruga theme isn’t your cup of tea, you can browse other themes by the site logo feature keyword:
https://wordpress.com/themes/filter/site-logo/Here are a few more that might work that I found using the above link to search:
https://apostrophedemo.wordpress.com/
https://corporatethemedemo.wordpress.com/
https://creativeportfoliodemo.wordpress.com/Best,
-Cat -
@deannafossen, what we can do is to put your logo image into the site title div as a background. Give the following a try and see what you think. I’ve used a Media Query to limit this change to screens/windows wider than 400px. Below that the logo goes back to where it was to prevent issues with your site title (name).
@media screen and (min-width: 400px) { .site-title { background-image: url("https://deannafossendotcom.files.wordpress.com/2016/06/logo-2-resize1.png"); background-position: left 0; background-repeat: no-repeat; background-size: 25% auto; line-height: 2.5; margin-left: auto; margin-right: auto; max-width: 300px; padding-left: 70px; } .site-logo { display: none; } } -
- The topic ‘Relocated Logo in Sela’ is closed to new replies.
WordPress.com Forums 