{"id":598,"date":"2026-10-26T23:20:53","date_gmt":"2026-10-26T23:20:53","guid":{"rendered":"https:\/\/hillcityweb.com\/themes\/docs\/modality\/block-editor-and-plugins\/"},"modified":"2026-10-26T23:36:34","modified_gmt":"2026-10-26T23:36:34","slug":"block-editor-and-plugins","status":"publish","type":"page","link":"https:\/\/hillcityweb.com\/themes\/docs\/modality\/block-editor-and-plugins\/","title":{"rendered":"Block editor, WooCommerce &#038; forms"},"content":{"rendered":"<h2>The block editor<\/h2>\n<p>The editor looks like your site: the same fonts, colors, content width and heading styles. The Modality palette and fonts are in the editor\u2019s color and typography settings, and they follow the Customizer, so changing the Theme Color there also changes it in your posts.<\/p>\n<ul>\n<li><strong>Wide and full-width blocks<\/strong> work on pages without a sidebar.<\/li>\n<li><strong>Block styles<\/strong>: <em>Card<\/em> for groups, <em>Rounded corners<\/em> and <em>Circle<\/em> for images, <em>Testimonial<\/em> for quotes, <em>Check marks<\/em> for lists and <em>Accent underline<\/em> for headings. Pick them in the block\u2019s <em>Styles<\/em> panel.<\/li>\n<li><strong>Patterns<\/strong>: every front page section is a pattern in <em>Patterns \u2192 Modality<\/em> (see <a href=\"..\/front-page\/\">Setting up the front page<\/a>).<\/li>\n<\/ul>\n<h2>WooCommerce<\/h2>\n<p>Modality styles the shop, product, cart, checkout and account pages to match your preset, including the block-based cart and checkout. With WooCommerce active, <em>Blog &amp; Footer \u2192 Shop (WooCommerce)<\/em> adds:<\/p>\n<ul>\n<li><em>Show the cart in the header<\/em>, with the number of items.<\/li>\n<li><em>Products per row<\/em> (2, 3 or 4) and <em>Products per page<\/em>.<\/li>\n<li><em>Shop and product pages layout<\/em>, with or without a sidebar.<\/li>\n<\/ul>\n<p>Other shop settings are in WooCommerce\u2019s own panel in the Customizer.<\/p>\n<h2>Contact Form 7<\/h2>\n<p>Forms made with Contact Form 7 get Modality\u2019s field, button and message styles, so a contact page looks finished without extra CSS. Its stylesheet only loads when Contact Form 7 is active.<\/p>\n<h2>Translation and right-to-left languages<\/h2>\n<p>Every text in the theme can be translated, and the layout mirrors itself for right-to-left languages such as Arabic and Hebrew. Translations come from translate.wordpress.org; plugins such as Loco Translate work too.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>The block editor The editor looks like your site: the same fonts, colors, content width and heading styles. The Modality palette and fonts are\u2026<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":597,"menu_order":24,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-598","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/hillcityweb.com\/themes\/wp-json\/wp\/v2\/pages\/598","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hillcityweb.com\/themes\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/hillcityweb.com\/themes\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/hillcityweb.com\/themes\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/hillcityweb.com\/themes\/wp-json\/wp\/v2\/comments?post=598"}],"version-history":[{"count":1,"href":"https:\/\/hillcityweb.com\/themes\/wp-json\/wp\/v2\/pages\/598\/revisions"}],"predecessor-version":[{"id":613,"href":"https:\/\/hillcityweb.com\/themes\/wp-json\/wp\/v2\/pages\/598\/revisions\/613"}],"up":[{"embeddable":true,"href":"https:\/\/hillcityweb.com\/themes\/wp-json\/wp\/v2\/pages\/597"}],"wp:attachment":[{"href":"https:\/\/hillcityweb.com\/themes\/wp-json\/wp\/v2\/media?parent=598"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}