Editor Layout - Multi-column layout and default layout on same page

Editor Layout - Multi-column layout and default layout on same page

Ali AdnanAli Adnan Posts: 43Questions: 16Answers: 1

Dear folks,
I have two editor on same page, editor-a having three fields and editor-b having more than 10 fields I want to use default layout for editor-a and Multi-column layout for editor-b.

Currently if I use below css it will apply on both editor, can you help me please how can I achieve this ?

div.DTE_Body div.DTE_Body_Content div.DTE_Field {
    width: 50%;
    padding: 5px 20px;
    box-sizing: border-box;
}
 
div.DTE_Body div.DTE_Form_Content {
    display:flex;
    flex-direction: row;
    flex-wrap: wrap;
}

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 48,908Questions: 1Answers: 7,132 Site admin
    Answer ✓

    Hi,

    What to do here is to use the displayNode() method:

    $( editorB.displayNode() ).addClass( 'twoColumnLayout' );
    

    Then update your CSS to reflect that class for the extra column layout rules.

    Allan

  • Ali AdnanAli Adnan Posts: 43Questions: 16Answers: 1

    Thanks

Sign In or Register to comment.