Hello Yumsun,
Thanks for reaching out about customizing the Yoast FAQ block. The styling of the different elements of a page (such as color, font, font size, headings), including the FAQ block, is usually controlled by your chosen theme. Changing the way your site and the FAQ blocks appear requires some knowledge of HTML and CSS. If you want to change the styling of the block, the following resources may be helpful to you:
– Our developer guide
– W3Schools Tutorials (HTML and CSS)
– WPBeginner: How to Easily Add Custom CSS to Your WordPress Site
Thread Starter
yumsun
(@yumsun)
Hi Maybellyne,
I’m using CSS, HTML and Javascript to create custom layouts.
To display the FAQ in an accordion style, I am using UIKit, which is implemented throughout the site.
To do this, I have added a class for UIKit to the ‘schema-faq’ class from Javascript. Because of this, the height of the document changes on the iPhone, so the anchor links from external pages show different position.
If I could add class to YoastSEO’s FAQ block in the PHP output, that would solve the problem, but it means there is no filter function to customize the output of Gutenberg block…
I’ll try another way. Thank you for your support.
Best regards,
Yumsun
Hi,
We do have some additional documentation in our developer blog regarding styling the Yoast FAQ & How-To blocks here – https://developer.yoast.com/blog/theming-gutenberg-the-faq-block/ & https://developer.yoast.com/blog/theming-gutenberg-the-howto-block/
Sorry that we couldn’t be of much more help here. Best of luck in further optimizing your site!
Thread Starter
yumsun
(@yumsun)
Hi,
Thank you for the additional support.
I am comfortable implementing the accordion FAQ.
I’ll be thinking about the linked issue on the iPhone for a long time.
It would be helpful if there was a filter that could output an arbitrary class for FAQ Block as that would be a quick fix.
Thanks,
yumsun
-
This reply was modified 2 years, 3 months ago by yumsun.
Hi,
For feature requests or enhancements that aren’t covered in the developer portal, we recommend that you create a new issue in our GitHub repository so our developers can take a look.
Thanks!
We are going ahead and marking this issue as resolved due to inactivity. If you require any further assistance please create a new issue.