- This topic has 8 replies, 2 voices, and was last updated 1 year, 7 months ago by
bobgarrett.
-
AuthorPosts
-
March 16, 2022 at 7:44 am #301595
bobgarrett
ParticipantHow do I remove the delay in the page titles appearing? I have tried then following which seems to have affected what I see in “inspect” of the css but the delay is still there.
body:not(.home) .custom-header-content {transition: unset;}
.custom-header {transition: unset;}August 26, 2022 at 8:17 pm #309979Sakin
Keymaster@bobgarretthomenetworks-co-uk: Sorry for the late reply, looks like we missed this topic. We usually reply within 24 hours. So, anyone, who didn’t hear us for more than 24 hours there must be an issue with your notification system just comment or contact us directly at https://catchthemes.com/contact-us/.
I don’t see a delay on your page title, can you tell me which page has that issue?
If you are talking about the padding-top for .custom-header then that delay is there due to the script to estimate the padding needed for fixed header .site-header. For that, you need to do a manual header padding-top as per your site and add the following CSS in the “Appearance => Customize => Additional CSS” box:
.custom-header { padding-top: 139px; transition-duration: 0s; } @media screen and (min-width: 480px) { .custom-header { padding-top: 203px; } } @media only screen and (min-width: 568px) { .custom-header { padding-top: 182px; } } @media only screen and (min-width: 742px) { .custom-header { padding-top: 139px; } } @media only screen and (min-width: 1024px) { .custom-header { padding-top: 153px; } } @media only screen and (min-width: 1200px) { .custom-header { padding-top: 214px; } }
Regards,
SakinJanuary 5, 2023 at 9:38 am #314110bobgarrett
ParticipantSorry for the long delay before responding. The delay on loading a page seems to be on every page except the home page.
As an example, this page https://www.ccrc.co.uk/about-chichester-cruiser-racing-club/ (and all the rest) load the top banner and the content and then after a short delay the page title appears.
Looking at the Chrome waterfall analysis the first item is “about chichester cruiser racing club” and takes ~2s. Then there are whole load more other small “GET”s until another “about chichester cruiser racing club” which takes ~3s.
Are you able to see this too?
January 5, 2023 at 5:26 pm #314114Sakin
KeymasterCan try adding the following CSS in “Appearance => Customize => Additional CSS” box:
.custom-header { transition: padding 0s; }
January 6, 2023 at 4:52 am #314145bobgarrett
ParticipantI had previously put this css in with 0.1s as the timing. I have also tried making it !important. But still the delay.
January 9, 2023 at 2:18 am #314214Sakin
KeymasterBut 0.1s is still timed. You need to move it 0s.
January 9, 2023 at 5:52 am #314237bobgarrett
ParticipantI had tried 0 and it is now 0 but still has delay.
January 12, 2023 at 1:34 am #314359Sakin
KeymasterI see that the JS adds the padding on top after analyzing its height. So, it takes a bit of time. You can manually add padding on top as per your content. Add the following CSS in the “Appearance => Customize => Additional CSS” box after that transition CSS:
.custom-header { padding-top: 139px; } @media screen and (min-width: 480px) { .custom-header { padding-top: 203px; } } @media only screen and (min-width: 568px) { .custom-header { padding-top: 182px; } } @media only screen and (min-width: 742px) { .custom-header { padding-top: 139px; } } @media only screen and (min-width: 1024px) { .custom-header { padding-top: 153px; } } @media only screen and (min-width: 1200px) { .custom-header { padding-top: 214px; } }
January 12, 2023 at 4:11 am #314364bobgarrett
ParticipantI have implemented that and it works so thank you so much.
-
AuthorPosts
- The topic ‘Load page title immediately’ is closed to new replies.