divya96

Thanks to your help, the issue has been fixed!

Here’s the updated code.

Display Recent WordPress Posts

<script>
    const apiUrl = 'https://creativeedu.in/wp-json/wp/v2/posts?per_page=4&_embed';
    const postsContainer = document.getElementById('posts-container');

    async function fetchAndDisplayRecentPosts() {
        try {
            const response = await fetch(apiUrl);
            if (!response.ok) {
                throw new Error('Failed to fetch posts');
            }
            const posts = await response.json();

            // Loop through the recent posts and create HTML elements
            posts.forEach(post => {
                const postElement = document.createElement('div');

                const title = document.createElement('h2');
                title.textContent = post.title.rendered;
                postElement.appendChild(title);

                const content = document.createElement('p');
                content.textContent = post.content.rendered;
                postElement.appendChild(content);

                // Check if featured media is available
                if (post._embedded && post._embedded['wp:featuredmedia'] && post._embedded['wp:featuredmedia'][0].source_url) {
                    const image = document.createElement('img');
                    image.src = post._embedded['wp:featuredmedia'][0].source_url;
                    image.alt = post.title.rendered;
                    postElement.appendChild(image);
                }

                postsContainer.appendChild(postElement);
            });
        } catch (error) {
            console.error('Error fetching or displaying posts:', error);
        }
    }

    fetchAndDisplayRecentPosts();
</script>

Display Recent WordPress Posts

We are using this code

<script>
    // URL of your WordPress site's REST API endpoint for posts
    const apiUrl = 'https://creativeedu.in/wp-json/wp/v2/posts?per_page=4&_embed';

    // Element where you want to display the posts
    const postsContainer = document.getElementById('posts-container');

    // Function to fetch and display recent WordPress posts
    async function fetchAndDisplayRecentPosts() {
        try {
            const response = await fetch(apiUrl);
            const posts = await response.json();

            // Loop through the recent posts and create HTML elements
            posts.forEach(post => {
                const postElement = document.createElement('div');
                postElement.innerHTML = `
                    <h2>${post.title.rendered}</h2>
                    <p>${post.content.rendered}</p>
                    <img src="${post._embedded['wp:featuredmedia'][0].source_url}" alt="${post.title.rendered}" />
                `;
                postsContainer.appendChild(postElement);
            });
        } catch (error) {
            console.error('Error fetching posts:', error);
        }
    }

    // Call the function to fetch and display recent posts
    fetchAndDisplayRecentPosts();
</script>

Yes.. checked, jetpack connected properly and it is active.. what may be the problem?

Here is the site url..
https://wealthynutra.com/

Please advice how to fix this issue ??

Thank you so much for your quick response.. It’s working fine now..

Hi,

Now FB verification is in verified status..

https://prnt.sc/gnBrbnzmSUrD

But still we have the issue URL Blocked.. As suggested in document.. nextend plugin not suggesting any OAuth URI… Please help me with the same..

https://prnt.sc/2zA8jTBReeH0

We have filled all the details.. Still not sure what is the mistake.. Please refer the following screenshot link..

https://prnt.sc/X7bRM45tvHWx

https://prnt.sc/emWkViBOYAlP

Business Review is in pending.. Do you think this might be the reason ?

https://prnt.sc/UVkH3eKxewuQ