H1 Tag does Not Take Effect
Sam Bin Ameera
Hello hey and hi.
Been using Helix template since 2015 and I want to tell you all a joke, I just today found out that none of my articles and pages have the proper H1 tag! they are all being affected by the default H1 tag which is my website title. That said I have an immediate problem:
I made a page using SP Page Builder (Component version 3.8.3) and also I am using Joomla 3.10.11 then assigned it to the main menu of my website. Now I can not assign a proper H1 tag to this content, here is what I have tried:
1-I have tried to mame the first row as a Heading content and make it H1. 2-I have assigned the desired heading title in Page Display option under main Menu option
Above done but when I check my content with any on-page SEO checker, one of the detected issues is "You are using more than 1 H1 tag on your webpage" and when I remove what I have done above (1 and 2), they say "You are not using your focus keyword/phrase in H1 tag". The H1 tag they detect on all pages is my website name.
Finally I tried to exclude my website name and I get "You are not using any H1 tag" even when I enabled what I have done above (1 and 2)
Paul Frankowski
Accepted AnswerThen use below Custom CSS
#sp-header .logo span {
font-size: 24px;
line-height: 1;
margin: 0;
padding: 0;
display: table-cell;
vertical-align: middle;
padding: 0 20px 0 0;
border-right: 1px solid #ddd;
font-family: Luckiest Guy, sans-serif;
font-weight: normal;
color: #0081c2;
}Remember that you have CSS compression, so must be reloaded after using above CSS.
Whole rest in your hands becuase you don't have our template, wt_duvana!, it only use our Helix3 engine.
Paul Frankowski
Accepted AnswerHi Sam,
And if you preview source code of your page(s) how many H1 tags you see?
I have many private websites built using J3.10 (still) and SPPB 3.8.9 and I have only one H1 there.
I have to see at least one page and/or get access then we can about details, otherwise ... I am blind.
SEO online tools sometimes cache results, so you may not see code changes so fast, after you make changes on your website, it's a popular issue. Also if your site uses caching.
Sam Bin Ameera
Accepted AnswerThank you for your response.
I undrstand what you are saying but I think there is a forced h1 tag on my template and I dont know where to edit that.
I dont want my website name to b forcd as h1 tag on all my website.
I have checkd th source cod and I see 21 instancs of H1 but the main on is the top one. I have shared it below as well.
Paul Frankowski
Accepted AnswerOk, I found.
The problem is inside your template, first < h1 > is used for the LOGO text (!) that as we both know is mistake.
You have to edit template code and correct that - this should be your first step.
In our Helix Ultimate 2.0.x we don't use < h1 > for logo anymore.
If your template is based on old Helix - edit that file: features\logo.php - find < h1 > and replace / or delete, but this same style (color, size).
Sam Bin Ameera
Accepted AnswerAppreciate the help pal.
Could you plz lt me know how I should access the template file?
Paul Frankowski
Accepted AnswerUsing FTP tool , File Manager from cPanel or Phoca Commander component.
But if you have Joomla 3.10 or Joomla 4x - you should be also be able to edit template files thru Joomla Template Manager
EXAMPLE
Sam Bin Ameera
Accepted AnswerUnderstood, am I in the right place now? I see 9x H1 instances hre, which one should I delete?
Paul Frankowski
Accepted AnswerReplace ALL but focus on lines >80+ where the text logo code is.
< h1> and < /h1>
with
<span>
and
</span>
I hope you know HTML basics.
Sam Bin Ameera
Accepted AnswerMy knowledge in HTML and webcoding is very limitd but I am trying to learn.
Whn you said "Then use below Custom CSS" do you mean I can just clear the data on that logo.php file and replace them all with just the custom css provided above?
Paul Frankowski
Accepted AnswerAbout using custom CSS in Helix3 > https://www.joomshaper.com/documentation/helix-framework/helix3/custom-css-header-code
In general in template settings > Custom Code > Custom CSS
and paste there. Example:
Sam Bin Ameera
Accepted AnswerThats for all the hlp, I think I have done it, thank you.
You mentioned "Remember that you have CSS compression, so must be reloaded after using above CSS"
Would a cache reload be enough or do I have to make that reload from somewhere else?
Paul Frankowski
Accepted AnswerI am not JCH_Optimize support - but as you probably noticed, it has Clean Cache button inside - use it.
Sam Bin Ameera
Accepted Answerit has Clean Cache button inside - use it.
I mean that one yes, done.
All is working perfect now.
Thank you Paul.