- This topic has 12 replies, 2 voices, and was last updated 6 years, 1 month ago by
.
-
Posts
-
Can my logo be inline with my title (next to it)? Instead of the logo over the title as it is…
Thank you!Hello @jjambeck
To make the logo appear next to the title , go to Admin Panel > Appearance > Customize > Site Identity . Here you can click on the Check to move Site Title and Tagline before logo.
If it does not solve your issue Please post your site URL so that we can inspect your website for the issue and provide a precise fix.
Best Regards!!!
This does not solve my issue. I would like the logo next to the title – as it is in the mobile version (it moves so they are horizontal). The only choices I am given are the logo on top or the title on top – but I would like them next to each other.
http://internationalmarinedebrisconference.org/
Thanks!Hello @jjambeck,
The menu title of the website dropped below the logo as the title text used in your website is longer than the site title allocated space as per the theme design.
Please add the following custom CSS in your Admin Dashboard > Appearance > Customize > Theme Options > Custom CSS Options : to resolve the issue in your website.
@media screen and (min-width: 1023px){ #site-header-text h1.site-title { margin-top: 32px; } .row .col.col-7-of-10 { width: 40%; } .row .col.col-3-of-10 { width: 60%; } }Hope this Helps,
Best Regards !!
Yes! That is an easy solve for that!
Now, can the logo be a bit larger on the computer screen view?
And last one – can the title font color be changed on the mobile screen view?
With those two addressed, I think the site will be PERFECT!Hello,
To accomplish your requests, please add in the following Custom CSS :
@media screen and (min-width: 1023px){ #site-header-text h1.site-title { margin-top: 54px!important; } .has-logo-site-title #site-logo img { width: 117px; } } @media only screen and (max-width: 768px){ #site-branding #site-header-text h1 a, #site-branding .site-description { color: #059b78; } }This will make your logo size bigger in the desktop, and will change the color of the text of the site title in mobile view to the color same as in the desktop view. If you want to change the color only for mobile view, please change the “#059b78” color code with the color Hex code of your desired color.
For reference on color Hex see the link here : http://www.w3schools.com/colors/colors_picker.asp
Hope this Helps,
Best Regards !!
This was all great and we are set to launch the site publicly this week – but now I am looking at the mobile site and the logo is large and covers the top of the slider image (pretty minor but would look better not overlapping) and then the title, only on the mobile site, is under the logo again, and not green like in the computer version. I had added the CSS above before and I thought it had worked, but then I updated the version of the theme to the latest. The custom CSS is still there, but the mobile version of the site is not looking like I want it. See the site here http://internationalmarinedebrisconference.org/ and let me know if we can get the title to be the color on the computer version and also have it next to the logo (not under it) on the mobile version. I am overall very happy with this theme and look! Thank you!
OK, if this is an easier solution, I can just delete the title from the mobile version and just have the logo – if that is easier than moving the title to be next to the logo – as it would also have to change color too since it is now white for some reason and the background is also white (which I like!).
Thank you!Hello @jjambeck,
Please try pasting in the following Custom CSS in your Admin Dashboard > Appearance > Customize > Additional CSS :
@media (max-width: 768px){ div#site-branding div#site-logo{ width:20% !important; } .site-menu div#site-header-text { width: 80%; } #site-header-text h1.site-title { font-size: 13px; margin-left: 10px; } #site-header-text h1.site-title { margin-top: 18px; } #site-branding #site-header-text h1 a{ color: #059b78 !important; } }This should put the title beside the logo in mobile view matching the color of the title to same as in the desktop view.
Hope this Helps,
Best Regards !!
YES!!! That did it!! But now the Logo is a bit too large on the mobile version – is there a way to make it be a bit smaller on that version only? Thank you so much for the great replies!
Hello,
While we have tested the website with the codes, the logo seems to be lining up to the size appropriate to the title beside it. However it did seem bit clinging to the bottom.
To re position it a bit aligned to the title, try adding in the following custom CSS :
@media (max-width: 768px){ .has-logo-site-title #site-logo img { padding-top: 0px; } }Hope this Helps,
Best Regards !!
Yep – it looks much better – thank you! How do I rate the Theme highly – your support on this effort has been awesome. Thank you again!
Hello,
We are very pleased to know that your issue has been solved .
If there are any further query, then, please feel free to post them.We will really appreciate if you could help us too by rating our theme in WordPress repo here:-
https://wordpress.org/support/theme/flat-commerce/reviews/
Best Regards!!
- You must be logged in to reply to this topic.
