How To Schema Image Alignment

#58161
  • Resolved Prakhar Verma
    Rank Math free

    Hi,

    I would like to align the images in the steps to center while keeping the text left-aligned. Is there a way to do it with the How-To Schema?

    Thanks,
    Prakhar

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

    Thank you for contacting Rank Math today.

    There are fields below the how to schema settings where you can modify the css of the steps and even add advanced custom styling.
    img

    Looking forward to helping you. Thank you.

    ​​​​​​

    Thanks! I don’t know how to use CSS however. Can you tell me the command I can use which will make the images align to the center while keeping the text left-aligned? Thanks a lot!

    Hello,

    Thank you for contacting Rank Math today.’

    I created the following CSS, you can try it and let us know how it goes

    .rank-math-howto-content{
     float:left;
    }
    img{
      display: block;
      margin-left: auto;
      margin-right: auto;
    }

    Looking forward to helping you. Thank you.

    ​​​​​​

    Thanks! Where should I enter this exactly?

    Alberto
    Rank Math business

    Hello,

    You would need to add in your current theme, in the style.css file the following code (at the end):

    .rank-math-howto-content.customHowTo{
     float:left;
    }
    .rank-math-howto-content.customHowTo img{
      display: block;
      margin-left: auto;
      margin-right: auto;
    }

    Then, you just need to add in the HowTo Block (at the end, in the field asking for additional classes) the following text:
    customHowTo

    And done!

    Looking forward to help you.

    I did exactly that. I first entered the following command at the end of style.css of my theme
    .rank-math-howto-content.customHowTo{
    float:left;
    }
    .rank-math-howto-content.customHowTo img{
    display: block;
    margin-left: auto;
    margin-right: auto;
    }

    Then, I entered customHowTo in the additional classes option of the howto rankmath schema.

    But it didn’t seem to work when I preview the draft. Are you sure it’s the right command?

    Hello,

    Thank you for contacting Rank Math today.

    Let me check up with the dev team and will let you know.

    Looking forward to helping you. Thank you.

    ​​​​​​

    Todd
    Rank Math free

    Hi,

    Please share the link where you placed the quiz.

    You can use this CSS in your theme’s style.css file if the one my colleague provided doesn’t work:

    .rank-math-howto-content{
     float:left;
    }
    img{
      display: block;
      margin-left: auto;
      margin-right: auto;
    }

    Let us know.

    Thanks for your help. I’m afraid it’s still not working, however.

    Todd
    Rank Math free

    Hello,

    What’s the URL with the issue?

    Here: https://designepiclife.com/how-to-get-your-life-together/

    I’ve kept the HowTo schema hidden by clicking the “eye” icon and replaced it with normal headings and paragraphs as of now.

    Alberto
    Rank Math business

    We might need to take a closer look at the settings. Please edit the first post on this ticket and include your WP logins in the designated Sensitive Data section.
    Sensitive Data Section

    It is completely secure and only our support staff has access to that section. If you want, you can use the below plugin to generate a temporary login URL to your website and share that with us instead:

    https://wordpress.org/plugins/temporary-login-without-password/

    You can use the above plugin in conjunction with the WP Security Audit Log to monitor what changes our staff might make on your website (if any):

    https://wordpress.org/plugins/wp-security-audit-log/

    We really look forward to helping 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 12 replies - 1 through 12 (of 12 total)

The ticket ‘How To Schema Image Alignment’ is closed to new replies.