Design Options

When you add a new content block as described in How to Use Content Blocks?, a modal shows up with some tabs. One of them is Design options. Follow to know how to customize content blocks design.

Content blocks design

1- Show on Desktop: Show/hide this block on desktop computers.

2- Show on Tablet Portrait: Show/hide this block on Tablets Portrait.

3- Show on Phone: Show/hide this block on phones.

4- Custom CSS Class: If you want to define custom CSS rules for this block, you can assign a class to it then assign rules to this class in Publisher → Theme Options → Custom CSS. You can add as many as classes you want and separate them by spaces. Read more about Custom CSS.

5- Custom ID: If you want to define custom CSS rules for this block, you can assign an ID to it then assign rules to this ID in Publisher → Theme Options → Custom CSS. You can assign just one ID.

6- Override Listing Settings?: If you toggle this to on, you see block global settings previously described in Blocks Settings. Now in Blocks Design you can override global options for this specific block.

7- CSS box: Here is a very user friendly menu for customizing CSS options of this block. You can assign different CSS properties here; margin, border-width, padding, background, etc.

NOTE: When you select a border color, do not forget to select border width in left hand-side scheme.