One of the most under appreciated page templates is our Ashford FAQ. If you follow a h2 > p pattern in your content then Ashford will automatically add collapsing titles. So if you click on a question title, the answer appears below.
This FAQ page markup is simple with added CSS to make it more interesting. The coolest part is that the A: and the Q: is added via CSS pseudo classes. If you want to try it out, add this CSS code to the Custom CSS field on the Pro Settings Panel. Or you can add it to your style.css.
body.page-template-page_faq-php .post_content h2 { border-bottom: 1px solid #DDDDDD; cursor: pointer; margin-top: 20px; padding-bottom: 8px; padding-top: 8px; text-decoration: none; } body.page-template-page_faq-php .post_content h2:before { content: 'Q: '; font-weight: bold; } body.page-template-page_faq-php .post_content p { -moz-border-bottom-colors: none; -moz-border-image: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; border-color: -moz-use-text-color #DDDDDD #DDDDDD; border-style: none solid solid; border-width: medium 1px 1px; margin: 0; padding: 10px; } body.page-template-page_faq-php .post_content p:before{ content: 'A: '; font-weight: bold; }
Liked this? Share it with your friends!