Set ‘text only’ as logo in WordPress over PHP

Set ‘text only’ as logo in WordPress over PHP

Or logo as text … Sometime somebody need text as logo. But you don’t want to make text as image and then upload it as logo. Right?

So you can set pure text as logo over PHP and then you can easily have it as main heading H1 which will have big benefit for SEO and organic search results. As usually you will place code snippet into your function.php file

The real and working example, as you can see, is on this web site. So what codes I used?

//Logo as text
add_filter('avf_logo_final_output', 'avf_text_logo_final_output');
function avf_text_logo_final_output($logo)
{
$link = apply_filters('avf_logo_link', home_url('/'));
$logotext = "Good";
$slogan = "to";
$subtext = "know";
$domain = ".tech";
$subtext = "<span class='subtext'>$subtext</span>";
$logotext = "<span class='logotext'>$logotext</span>";
$slogan = "<span class='slogan'>$slogan</span>";
$domain = "<span class='domain'>$domain</span>";
$logo = "<h2 class='logo bg-logo custimisedlogo'><a title='Good to know!' href='".$link."'>".$logotext."$slogan$subtext$domain</a></h2>";return $logo;
}

Few words about…

I decided to do different font formatting of all words.

Good is as $logotext, to is a $slogan, know is $subtext and $domain is obviously .tech So I defined ‘items’ and its content.
Then I defined styling for each ‘item’ which is in my linked CSS file.

.custimisedlogo {
padding-top: 27px !important;
letter-spacing: 1px !important;
color: #535353 !important;
line-height:37px;
}
.logotext {
font-family: 'extrabold' !important;
text-transform:uppercase;
font-size: 34px !important;
}
.slogan {
font-family: 'light' !important;
text-transform:uppercase;
font-size: 34px !important;
}
.subtext {
font-family: 'extrabold' !important;
text-transform:uppercase;
font-size: 34px !important;
}
.domain {
font-family: 'extrabold' !important;
font-size:20px !important;
}

Yes, I know the CSS could be written in better organised way :-) Anyway, you don’t need to use !important unless it is not working and you have rewrite the same existing css rule, but you don’t want spend time to modifying default WordPress theme files (later you will do update an your work would be overwritten, so yes… !important is comfortable).

And everything is packed as Heading H2 in tags. I keep H1 for article heading.

Yep, it is that simple.