Setka Post Editor Getting started with the editor. Shortcut keys

Getting started with the editor. Shortcut keys

How to start using the Setka Editor plugin?

After you have installed the Setka Editor plugin, you will see the Setka Editor tab on the Add New Post page.

 1.png

 

Can I move between Setka Editor and WordPress editor tabs?

As soon as you click the Setka Editor tab in a WordPress post, other tabs (visual/text) become unavailable. The built-in editor is unable to finalize a post created in Setka Editor as WordPress cannot perceive the layout correctly.

 

2.png

 

How does the Setka Editor interface look inside WordPress?

The Setka Editor interface contains several blocks:

  1. The post area where you work on the content of the article.
  2. The horizontal toolbar at the top of the post area allows you to format various components of the post: paragraphs, selected text, images, grids, embeds, etc
  3. The vertical toolbar to the right of the post area allows you to insert various elements into the post: grid modules, components, images, embeds, etc
  4. Context menu appears upon a right-click. It is an extended tool for managing paragraphs and copying various elements within your post.

The number of tabs in the top horizontal toolbar changes depending on what post element you have clicked on. If the cursor is on text, the Paragraph tab is available; when adding images – you see the Image tab.  

 

 

 

 

How do I set up the editor's field width?

Each WordPress theme has a defined post width or sometimes it allows for several width options (for example wide or narrow).

However, Setka Editor provides you with maximum flexibility. In order to see how your post will look in your theme allowed width you can adjust the editor settings at the bottom of the page (View post as > 620 px/940 px/1200 px)

 

______________2017-05-03___13.26.35.png

 

What are the options to further customize the post?*

*Custom CSS tool is available only on Pro plan.

Even though posts can be created without the use of custom CSS or HTML codes, Setka Editor allows you this flexibility as well. You can edit HTML code directly (Post > Advanced > Edit HTML) or use custom CSS for texts and elements (open the corresponding tab in the top panel). For example, if you would like to use custom CSS for a specific paragraph, click inside a paragraph to open the Paragraph tab > ...> Custom CSS.

 

3.png

 

What does the post preview look like on various devices?

Click the preview post icon (eye), in the vertical right-hand toolbar or press Tab to see what the post looks like on desktops and mobile devices. To close the preview either click on the "X" in the top right corner or press Esc/Tab.

 

Shortcut keys

In order to save time when editing a post, you can use these keyboard shortcuts. Click the shortcuts button (keyboard icon) at the bottom of the right-hand toolbar for a full list of shortcuts available.

Shortcodes for Mac

  • TAB – show/hide the post preview
  • Ctrl + 1...9 — specify styles for the paragraph
  • Ctrl + (up-down arrow) — specify the bottom indentation of the element

  • Сmd+Alt+Сlick — select the grid

  • Ctrl/Cmd + Click — select several elements

  • Ctrl + Shift + A — select all elements

  • Delete — delete the selected elements (except embeds and paragraphs)
  • Shift + Delete — delete the selected paragraph or embed
  • Ctrl + Z — UNDO, the same as a right click
  • Cmd + Enter — a new paragraph within one grid
  • Cmd + Alt + Enter — new paragraph before a current grid
  • Enter — new paragraph after grid
  • Alt + Enter — new paragraph inside one grid

Shortcuts for PC

  • Tab — show/hide post preview
  • Ctrl + 1...9 — set paragraph styles
  • Ctrl + (up-down arrow) — set the bottom indent of the element
  • Cmd + Alt + Click — select several elements
  • Ctrl + Shift + A — select all elements
  • Delete — delete selected elements (except embeds and paragraphs)
  • Shift + Delete — delete selected paragraph and embed
  • Ctrl + Z — the same as UNDO when you click on the right mouse button
  • Ctrl+ Alt + Enter —a new paragraph before a current grid
  • Ctrl+ Enter — a new paragraph within one grid
  • Enter — new paragraph after grid
  • Alt + Enter — new paragraph inside one grid

 

Grids Panel

  • Click (on the grid icon) — transform each selected element into a single grid
  • Shift + Click element — transform each selected element into a single grid
  • Ctrl + Click element — insert an empty grid after the selected element

 

Images panel

  • Click (on the image) — insert an image after the selected text
    Shift + Click — insert an image into the line

Sometimes shortcuts can conflict with plugins of your browser. In this case, you can disable the plugin or avoid using this shortcut.

Related articles