Featured Image Is Not Showing Up During The First Page Load

[Abhishek Kundu]

Hi Tom,
I am using your generatepress wp theme for some time now. It’s a great theme. Well recently I have launched a website (http://www.archblogger.com/) & I have featured image on every post which I write. But I have noticed that if you try to open the post for the 1st time the featured image of the post is not displayed but if you reload it, the image is shown up properly in the post.
Eg: http://www.archblogger.com/how-to-get-free-backlinks-from-wikipedia.html

I have made few alterations using the gp plugins which I got from your website.
Looking forward for your reply.

Kindest,
Abhishek

[Tom]

Hi there,

It loaded for me first time.

I also browsed around your site and all of the images loaded on first load.

That being said, it looks like you have some sort of lazy loading plugin activated for the images so they fade in? I’m willing to bet if they aren’t loading for you on first load it’s that plugin.

Lazy load images hide the image on initial load, and then fade them in as they enter the viewport.

It’s working for me, but if there’s an ongoing issue I would try and deactivate that plugin and see if it fixes it.

Thanks!

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Abhishek Kundu]

Hi Tom,
Thanks for your reply. YOu are right in your observation. I am presently using BJ Lazy Load wp plugin in my website. While browsing through their documentation I have found, that if I use the class name no-lazy in the images then the image will be skipped by BJ Lazy Load plugin.

Where can I find the function which is calling the featured image on the page & how can I insert the class name over there?

Kindest,
Abhishek

[Tom]

So you’re wanting to add the class “no-lazy” to your featured images?

Are you using the Blog or Page Header add-ons?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Abhishek Kundu]

Hi Tom,
I have activated the featured image via the following method.
Appearance-> Customize-> Page Header-> Single Post Header Position-> (Below Post Title) & in the Simple Custom CSS I have written .generate-page-header {text-align: center;}.

I am willing to add “no-lazy” class inside the featured image which might help me to resolve this issue with I am facing.

Kindest,
Abhishek

[Tom]

Try giving this function a try: https://gist.github.com/generatepress/c5bc0ee37bb767a703c5

Adding PHP: https://generatepress.com/knowledgebase/adding-php-functions/

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Abhishek Kundu]

Hi Tom,
Thanks for your reply. I have installed the child theme of generatepress which was provided in your website & I have also edited functions.php of the child theme as per your instructions. After doing so I think the featured image of the post is loading properly as it’s able to add the no-lazy class along with the image but unfortunately it’s showing a warning message.

The warning message is
“Warning: Missing argument 2 for generate_custom_image_attributes() in /home/abhkun/archblogger.com/wp-content/themes/generatepress_child/functions.php on line 11”

How can this be resolved?

Kindest,
Abhishek

[Abhishek Kundu]

Hi Tom,
I forgot to mention that “no-lazy” is being applied to all the featured images in the website. I want to apply “no-lazy” for single post & not in the home page of the website. How can is_single() function be implemented along with the set of codes which you provided me with?

Kindest,
Abhishek

[Tom]

Can you try this updated code?: https://gist.github.com/generatepress/c5bc0ee37bb767a703c5

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Abhishek Kundu]

Hi Tom,
The updated code did work.. Thanks for your help. I have got two more questions.

• Can I load javascripts, css files from a sub domain. eg: assets.archblogger.com for the theme & the installed plugins?
• Can I load java-scripts & css of specific plugins like contact form 7 only in the Contact Us page as they are not required in the other pages?

Actually I want the website to load faster.

Kindest,
Abhishek

[Jean]

Hey Abhishek,

The first question you just need to enqueue the script with the right path, check below:

add_action( 'wp_enqueue_scripts', 'awesome-sample_script' );
function awesome-sample_script() {
	wp_enqueue_style( 'my-awesome-script', 'http://yourdomain.com/youscript' );
}

For the second one, this script will help you: https://gist.github.com/JeanPaiva/dce666311990974b5d97

🙂

[Author]

Posts