Sign in

Adding custom HTML tags in TinyMCE

  • This topic has 3 replies, 3 voices, and was last updated 3 months, 3 weeks ago by .
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #7061
    Avatar photogpsblues

    Hello,

    I would like to add a tag structure through the Tinymce editor (eg: two column table with classes, div structure with classes, etc.).
    This makes some operations simple for those unfamiliar with html.
    I found this article on stackoverflow: link

    Could it work on Publii?

    Thank you

     

    #7301
    Avatar photogpsblues

    Yup! it is possible with the TinyMCE plugin template.

    In this example (file: tinymce.override.json) I have configured the plugin to insert a table structure with custom class and random image.
    It is possible to configure more templates that are activated with the new button in the toolbar2.

    For more informations see https://www.tiny.cloud/docs/plugins/opensource/template/#

    {
        "toolbar2": "template styleselect formatselect searchreplace hr readmore removeformat undo redo restoredraft charmap nonbreaking visualchars visualblocks sourcecode",
        "plugins": "template charmap nonbreaking advlist autolink autosave link image lists hr pagebreak searchreplace media table paste autoresize emoticons textpattern toc visualchars visualblocks",
        "template_replace_values": {
            "immagine": "",
            "testo": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
        },
        "template_preview_replace_values": {
            "immagine": "",
            "testo": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
        },
        "templates": [
            {
                "title": "Griglia home",
                "description": "Griglia a due colonne responsive per home page",
                "content": "<table class='grid-2c'<tr><td>{$immagine}</td><td>{$testo}</td></tr></table>"
            }
        ]
    }

     

    #8028
    Avatar photocandidexmedia

    Hi gpsblues! Thank you for sharing this!

    Do you know how to use the tinymce.override.json to override the block format dropdown? I’m trying to add custom HTML tag blocks (exactly like the issue listed here: https://forum.getpublii.com/topic/adding-container-tag-to-wysiwyg-block-post-editors/#post-8027)

    #8029
    Avatar photoBob

    Have a look at this topic: https://github.com/GetPublii/Publii/issues/1062

    --
    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 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.