HowTo Schema Content Spacing Issue

#305945
  • Resolved Tool Miner
    Rank Math free

    I have set up HowTo Schema. But there is no spacing between the Step Images and Below content (Text). So, it becomes difficult to read. Plus, the images don’t have any lightbox to click and enlarge the Image

Viewing 9 replies - 1 through 9 (of 9 total)
  • Hello,

    Thank you for contacting the support, and sorry for any inconvenience that might have been caused due to that.

    The appearance of our HowTo schema is dependent on your theme’s styling so you may need to adjust the style of the HowTo block using CSS.

    Here I created a CSS for you to add spacing between the step image and the text:

    .rank-math-block .rank-math-step-content img{
        margin-bottom: 12px;
    }

    As for the lightbox, unfortunately, Rank Math’s HowTo block doesn’t have that feature as it’s just a basic image.

    Hope that helps and please do not hesitate to let us know if you need our assistance with anything else.

    I also want to add spacing between The step content and the next step title. because the content of step 1 gets mixed with the title of step 2.

    Also, in SERPs results, there are many other results with which FAQs are shown at the bottom in the accordion form in Google Results.

    I am also ranking higher for many keywords but, my FAQ section is not shown in Google SERP Results below the Meta Title and Description in the Accordion Form.

    Plus, thanks Jeremy for the CSS Code. Its really working.

    There is another issue with Step Images being on the left side. When I try to move its positioning to the center the whole Snippet along with text also gets centralized.

    Prabhat
    Rank Math agency

    Hello,

    Please note that even if you’ve configured everything correctly, it is completely up to Google to add/remove rich results from the website. You can have a look at this guide for a quick reference for reasons why rich results are not displayed: https://www.searchenginejournal.com/why-rich-snippets-not-showing/380502/

    Regarding the CSS, please replace the previous code with the below one and see if it gives you the desired output:

    .rank-math-step{
        margin-bottom: 30px !important;
    }
    .rank-math-block .rank-math-step-content > img {
        display: flex;
        margin: 0 auto 12px;
    }

    Hope this helps.

    Thank you.

    Thanks, Prabhat

    Also, there is an issue with the main How To Image that shows at the top before the Time Needed Field.

    The image and below introduction text have no spacing.

    Prabhat
    Rank Math agency

    Hello,

    Please add the below CSS code and see if that gives the required output:

    .rank-math-howto-description > img {
        margin-bottom: 15px;
    }

    Hope this helps.

    Thank you.

    Thanks

    Problem solved

    Prabhat
    Rank Math agency

    Hello,

    We are super happy that we could address your concern. If you have any other questions in the future, know that we are here to help you.

    If you don’t mind us asking, could you please leave us a review (if you haven’t already) on https://wordpress.org/support/plugin/seo-by-rank-math/reviews/#new-post about your overall experience with Rank Math? We appreciate your time and patience.

    If you have another question in the future, please feel free to create a new forum topic, and it will be our pleasure to assist you again.

    Thank you.

    Hello,

    Since we did not hear back from you for 15 days, we are assuming that you found the solution. We are closing this support ticket.

    If you still need assistance or any other help, please feel free to open a new support ticket, and we will be more than happy to assist.

    Thank you.

Viewing 9 replies - 1 through 9 (of 9 total)

The ticket ‘HowTo Schema Content Spacing Issue’ is closed to new replies.