How Can I Make The Header Logo Bigger And Add Text
chris wilhelms
The logo spot makes the logo small and distorted, how can that be made bigger?
also how can I add text After the logo.
example: LOGO->Website Name
Image below showing what I mean with the logo and title.
Rashida Rahman
Accepted AnswerHi there!
Thanks for your query.
You can control your logo height from the basic tab of your Template Options. Here is a sample screenshot for your ease: https://prnt.sc/fTyRJOd0oS4R
If you want it with custom code, then here is the code you need to put in yout custom CSS:
.logo-image {
height: 150px !important;
}If you want you can publish a module with your desired text in the logo position. You can do this with CSS either:
#sp-header .logo a:after {
content: "Website Name";
}Note: Path towards custom CSS(Joomla 3): Extensions>Templates>Styles> Click on your current default template name then choose Template Options. Then find custom CSS within the custom code.
Hope this helps!
Best Regards
chris wilhelms
Accepted AnswerI must have had a typo as i tried that but now it works(dekstop only) it doesnt make the logo any bigger on mobile or tablets
cool thanks.
now i just need to center the text on the logo as it rides near the top of the logo.
Rashida Rahman
Accepted AnswerHi,
No issues:)
You are using different image for your smaller devices and it is set as 36px. Here is a screenshot: https://prnt.sc/4Mc9EGLKPQa9 . So, it has different class name. You can use the following code. then:
.logo-image-phone {
height: 50px;
}You need to adjust your helight value as per your need.
Moreover, your header height is reduced to 50 px for smaller devices: https://prnt.sc/X9Z4V72-J9zK, hence you need to use media query to adjust your header height accordingly.
@media (max-width: 991px){
#sp-header {
height: 50px;
}
}Best Regards