Home › Forums › Automattic › Bon Vivant › Break site title to second line or replace with bigger logo
-
AuthorPosts
-
Surfer Joe’s Pub & GrillMemberI’ve been trying to research the answer on this for a couple of days now and hoping someone can help out with the site I’m working on, http://www.surferjoescb.com.
Because the site tile is so long, it’s broken on to two lines, but not in the way I want it to. I would like to have “Surfer Joe’s” on one line just the way it is with regards to font size and color, and then on the second line have “Pub & Grill” reduced in size to about 72px and the font color changed to #96f7e5. Both lines centered.
The only other option I can think of is to replace the site title with my logo that contains the name. The only problem with that is I would need to make the logo larger than what’s currently allowed by the theme in order to clearly see the text.
I’m hoping someone much smarter than I can figure this out for me. I sure would appreciate the assistance.
Thanks
December 18, 2014 at 3:29 pm #162634
Kathryn P.Happiness EngineerI would like to have “Surfer Joe’s” on one line just the way it is with regards to font size and color, and then on the second line have “Pub & Grill” reduced in size to about 72px and the font color changed to #96f7e5. Both lines centered.
Hi there, I can’t think of a way to accomplish this, since there isn’t a way to either designate a specific point for a line break within the site title, nor is it possible to use two different colours.
The only other option I can think of is to replace the site title with my logo that contains the name.
That is a certainly a good workaround, if you can keep the text legible in the graphic.
Another option would be to reduce the size of the site title so it all fits on one line. Something like this:
.site-title { font-size: 95px; padding-bottom: 20px; }
Here’s what it would look like:
You could also wrap it in a media query so it only applies to larger screens:
@media only screen and ( min-width: 960px ) { .site-title { font-size: 95px; padding-bottom: 20px; } }
Let me know if you have any other questions!
December 18, 2014 at 11:18 pm #162635
Surfer Joe’s Pub & GrillMemberThanks so much for the assistance. That at least provides us with some additional options.
If we decide to go the logo route, is there a way to increase the allowable logo size in order for it to be large enough to see the text? An example of the size we need is contained in the first post on the front page. This would probably be our preferred option if possible.
Thank you
December 19, 2014 at 4:10 pm #162657
Kathryn P.Happiness EngineerSince the site logo is sized using a function in the theme files, there isn’t a good way to increase its size while retaining image quality.
To see what I mean, you could try adding this custom CSS:
.site-logo { max-height: 294px; width: 300px; }
…but I wouldn’t recommend it, as the image will turn fuzzy.
I did notice that the maximum site logo size for Bon Vivant is 940px wide by 235px high. You could try reformatting the logo/text in a graphics program into something within those dimensions and see how that looks.
December 19, 2014 at 5:43 pm #162662
Surfer Joe’s Pub & GrillMemberThank you
December 22, 2014 at 2:08 pm #162664
Kathryn P.Happiness EngineerMy pleasure. I’m going to mark this thread as resolved but feel free to start a new one if you need anything else.
April 6, 2016 at 12:43 am #163774
Surfer Joe’s Pub & GrillMemberHello. I’m not sure if this is allowed but we are the new owners and we would like to make a change to the added “reservation” text box. Is it possible to do this way?
Thank you.
Kimberly
April 6, 2016 at 3:20 am #163775
Kathryn P.Happiness EngineerKimberly – this thread is already resolved. Could you please start a new thread and explain what you would like to do in more detail so we can better assist? Thanks.
Visit:
https://theme-support.wordpress.com/forum/automattic/bon-vivant…and scroll down to post your question.
-
AuthorPosts
The topic ‘Break site title to second line or replace with bigger logo’ is closed to new replies.