Concept and Use of Design Block in Protein

What is a Design Block? How is it used on Protein sites? Design Block; It was created to use specially designed content as a block.

Route: Protein > Design Block

What is a Design Block?

The Design Block can be thought of as a box that can be used in the desired region from the page design. It will be created by the existing editor in the Design Block structure; A block can be made with specially designed content, images, and titles. If the block is produced, the desired region can be used on the page or menus on the site. It can also be used on more than one page of the site if needed. It is also among the options to use for making small changes in the design of a produced block. Design Block offers flexibility in design and multiple uses of a design.

How to Create a Design Block?

When you click on the Protein site making add-on on Workcube, the page in the image below is reached. From here, proceed by selecting the Design Block.

Afterward, you reach the page where previously created blocks are listed and the new block creation image is displayed. It can be found by searching for the names of the designs created here, or it can be selected from the list and edited over. For a new design, the block design is started by using the "Create Design Block" option, as shown in the image.

On the Design Block page; Title, author, and content editor are available. For each block; A block is created by adding the name, author, and content of the block and saving it. By using the Block Editor, content, titles, images, etc. to be used on the page can be added. Again, the codes of the designs created in different code environments can be saved by clicking View>Source code from the existing tabs on the Editor and throwing them into the open box. The design created in this way will appear in the Editor. Also, each design can be viewed with View>Preview.

It can be updated by clicking on a previously created design and making changes to this design. With the "World" icon at the top right of this page, we can access the sites created on the protein, where we can use the design, as a shortcut. With the "Brush" icon, you can access the "Design Block" page as a shortcut.

Using Design Blocks

Click on Protein > Sites > Site domain name to go to the administration page of a site. From the pages under the Pages box, the page to which the block is to be added is selected and the Designer field, which is also included in the image, is reached. In which part of the page the block is desired to be used, the Design Block under Widgets is selected by drag and drop method.

At this stage, the screen in the image will appear. In this area, the blocks that were designed and created by following the steps described above will be listed. The desired block can be selected and used on the page. In addition, a new block can be created by selecting a new block design option in this area. After the selected or newly created block, it will be displayed on the Design Block Widget as it is in the image.

Attention: There is an important feature that should be noted here. The block selected in this area is added to the page by copying it from the Design Block List. The change in the selected block design at this stage is limited only to the block used in this widget and does not affect the main block in the General Design Block List. This feature provides additional flexibility to the Design Block structure.

Using the Design Block in the Menu

We talked about the use of Design Block in the page structure above. Similarly produced blocks can also be used in the Menu structure. There are menus created under the Menu Definitions box on the site management page. More in-page links can be provided by adding submenus to these menus. Blocks can also be added to these structures, which are defined as drop-down menus. In the images below, there is the use of the Design block on a menu submenu design page and its image on the page.

In summary, Design Block is a structure that should be preferred for specially designed objects on pages and menus, structures to be used in more than one area, and interesting highlighting articles that do not consist of long content. Ease, quickness, and flexibility in design are among their greatest advantages.