Article #5

This example shows how to connect your own styles for an article or any other content in Redactor. The styles will be isolated from the page styles thanks to the iframe mode.

Autem, quibus ego cum soluta nobis est cur nec

Si sine causa? quae fuerit causa, mox videro; interea hoc epicurus in culpa, qui in sanguinem suum tam crudelis fuisse, nihil oportere nimium nos causae confidere, sed et fortibus viris commemorandis eorumque factis non numquam eius modi tempora incidunt, ut de homine sensibus reliqui nihil.

Probabo, inquit, sic agam, ut de commodis suis cogitarent

Sunt autem nusquam hoc tenebo

Ut placet, inquam tum dicere exorsus est primum igitur, quid est et molestiae consequatur, vel illum, qui ratione voluptatem accusantium doloremque laudantium, totam rem aperiam eaque gaudere ut ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut et iusto odio dignissimos ducimus.

Tum dicere exorsus est cur verear, ne interiret at magnum periculum adiit in oculis quidem se ipsam causam non intellegamus, tu paulo ante cum memoriter

Omne animal, simul atque natum sit, aspernatur aut in voluptate ponit, quod summum malum dolorem, idque facere possimus, omnis dolor repellendus temporibus autem nusquam hoc tenebo, si ob rem aperiam eaque ipsa, quae dices, libenter assentiar probabo, inquit, sic agam, ut calere ignem, nivem esse.

Certe, inquam, pertinax

Ut placet, inquam tum dicere exorsus est primum igitur, quid est cur verear, ne interiret at magnum periculum adiit in oculis quidem rerum necessitatibus saepe eveniet, ut calere ignem, nivem esse ratione et harum quidem rerum hic tenetur a sapiente delectus, ut earum rerum hic.

Similique sunt in bonis sit

Primum igitur, quid et accurate disserendum et voluptatem appetere eaque gaudere ut aut ad naturam aut rerum hic tenetur a sapiente delectus, ut calere ignem, nivem esse appetendum, alterum aspernandum sentiamus alii autem, quibus ego cum teneam sententiam, quid est cur nec me ab eo.

Hanc ego assentior inquit

Quid ex ea quid aut odit aut quid et quas molestias excepturi sint, obcaecati cupiditate non fuisse torquem detraxit hosti et quidem faciunt, ut aliquid ex eo ortum, tam egregios viros censes aut in gravissimo bello animadversionis metu degendae praesidia firmissima filium morte multavit si.

Code

<div id="entry-article-5">...</div>

<script src="/assets/redactor/plugins/block-class/block-class.js"></script>
<script src="/assets/redactor/plugins/alignment/alignment.js"></script>

const app = Redactor('#entry-article-5', {
    plugins: ['blockClass', 'alignment'],
    pathbar: true,
    css: '/assets/redactor/',
    classname: 'entry',
    padding: '60px 60px 80px 60px',
    width: '760px',
    custom: {
        css: [
            'https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,700;1,400;1,700&display=swap',
            '/assets/css/articles/article-05.css'
        ]
    },
    classes: {
        blocks: {
            quote: 'quote outset-both'
        }
    },
    formatItems: {
        lead: {
            title: 'Lead',
            params: {
                tag: 'p',
                classname: 'lead'
            }
        },
        'lead-outset': {
            title: 'Lead + Outset',
            params: {
                tag: 'p',
                classname: 'lead lead-outset outset-both'
            }
        }
    },
    image: {
        upload: '/endpoints/upload-image/',
        select: '/endpoints/images.json'
    }
});