Sign in

Adding “aside” container tag to WYSIWYG & BLOCK post editors

  • This topic has 1 reply, 2 voices, and was last updated 5 months, 4 weeks ago by .
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • #6565


    I wanted to have an <aside> container in my posts and found out that it was possible to add a  paragraph format by adding  custom formats  to the “customElements” in the theme’s config.json.

    Add to "customElements" in config.json
       label": "Aside block-right",
       cssClasses": "post__aside",
       selector": "aside"
    Custom css
    .post__aside {
      margin-top: 1.7rem;
    @media all and (min-width: 37.5em) {
      .post__aside {
        float: right;
        margin: 1.7rem 0 1.7rem 3.4rem;
        max-width: 40%;
        position: relative;
        z-index: 1;
    .post__aside > :nth-child(1) {
      margin: 0;

    However, unlike the “Info”, “Highlight”, “Success” and “Warning” paragraph formats which worked on a <p> paragraph selector, the <aside> paragraph style works only if there was already a block of text marked out with <aside> and </aside> selectors. End result being <aside class=”post__aside”>

    My question is: how can we add <aside> as a block format like the “Pre”, “Code” or “Blockquote” paragraph blocks.


    Tomasz Dziuda


    You can try to override field:

    block_formats: ‘Paragraph=p;Heading 2=h2;Heading 3=h3;Heading 4=h4;Heading 5=h5;Heading 6=h6;Address=address;Pre=pre;Code=code;Blockquote=blockquote’,
    In the TinyMCE config – maybe it will help for your case

    Do you appreciate the support you've received today? If so, consider donating to the Publii team by clicking here; we'll be sure to use your donation to make Publii even better!

Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.