Basic actions in the Devellp editor
Devellp editor is an easy-to-use tool for creating websites. Instead of developing a concept and design from scratch, you can create/manage a site with just a few clicks with the help of pre-made blocks. The use of the ready-made blocks minimizes the possibility of a design error and also significantly saves you time on site development.
Once you have opened your site's editor, you can see a toolbar at the top where the elements of navigation within your site editor are gathered:
Upon clicking on the tabs and links correspondingly, you will be able to navigate within your current site's editor its settings. Here is a brief note about the top editor panel:
( 1 ) My websites. This is a quick link back to your account's page where you can find a list of all of your sites in case you need to navigate from the current site to another one.
( 2 ) Site settings - self-explanatory: this drop down's options will take you away from the editor to the chosen section of the current site's setting.
( 3 ) Page management menu. Here you will find a button leading to the settings of the main site blocks, list of your site pages and pop-ups and, your site style settings.
Please note that the pages that are displayed here are visible solely in the editor and are not accessible to visitors until you link them to your site menu or other elements. To open the editing mode of a particular page, click on that page's tab in the list. Our article Adding pages will show you how to create wide navigation on your site.
( 4 ) Quick navigation between computer monitor and cellphone/tablet preview.
( 5 ) Undo and Redo buttons. They are to help you to quickly discard (and return back, if needed) a change you have just made in the editor. This will work only for the current session in the editor. To undo your site modifications made earlier than within this session and to restore a previous version of your site, we recommend using your site history (see below).
( 6 ) Autosave status. This section lets you know that all changes you have made so far are safe now.
( 7 ) Upgrade link. This is a quick access point to your site's upgrade page within the editor to take your site from its free/trial version to its fully functional Pro version. Preview your site to see how everything looks before pushing the changes you have applied to it live.
( 8 ) Preview your site as a visitor.
(9) Publish your site to make it look exactly how you see it in the editor.
(10) History Here you can manually create and store your different site versions and recover any of them when needed. It is very important to have a copy of your site before modifying it further. You can learn more about it in our dedicated article Site history.
(11) Comment mode. Review feedback on your published site from everywhere to take notes and see how great it is.
(12) Share your site's link with your colleagues or relatives to get a deeper insight about your website.
(13) Hide your editor's menu, - the very top row of your editor's top bar, - to allow a bit more space for yourself in the editor.
(14) Help. We always are just one click away from you to help you in building your online presence. Click this drop-down to get to our Help Center, get familiarized with the useful tips we have shared or, if you wish, order our site building services from our Design Studio professionals.
All of the above is so accessible!
The websites on Devellp are created with the help of the blocks — full-width sets of elements that are easily adaptable to different screen resolutions. We offer blocks for various business purposes — showcasing images, team presentation, products exposing, describing services, etc.
To place a new block on a page, check the article Adding blocks.
Tip: If none of our pre-made options in the gallery meets your needs, check the article Adding a custom block to see how you can create a block that fits your design needs from scratch.
See our video tutorial on how to work with the blocks below:
You can move, delete and hide, or duplicate a block to another page of your site.
Moreover, our blocks are easily customizable, so you can adjust their layout to match the overall design of the site. For more detailed information, follow the instructions in the article Changing the design of a block.
Your texts, images, buttons, and other block contents are referred to as your site's elements. All elements have their own placeholders — an area they occupy in a block. You can also enrich the look of your blocks by adding additional elements to them — more buttons, lists, dividers, or social icons:
Each item has its own settings, but there are basic actions that can be applied universally — you can copy, delete or move them within the block they are added to.
Besides, elements are usually gathered in columns for quick customization. With the help of columns, you can easily adjust your content alignment or change the background in this specific part of the block. See the article Managing elements to learn more about the columns and the elements they contain.
Some blocks in the gallery have unique settings and behavior — for example, collections and lists. Each item in these blocks keeps the same layout as others. For example, if you delete an element from one list item in the collection, it will be automatically deleted from every other list item. This simplifies the editing process a lot!
Moreover, the collections can be turned into different modes. You can enable a slider mode with the navigation elements as well as organize the items with the help of tabs.
To replace a text existing in a template with your own, select it in the placeholder and enter your own content. Besides, you can add an additional text element in a block following the instructions in the article Adding elements. You can apply the regular settings to your texts available all elements — copying it, moving it anywhere within its block, and deleting your text.
To customize the display of your text — change its style, size, color, line height, alignment, and so on — select the text and choose an action in the pop-up menu:
The text font is automatically adjusted on your site, but if you want to change it, please refer to the article Changing site's font to know how to do it.
If you haven't found the font you were looking for in our gallery, you can upload your own following the instructions in the article Uploading your own font.
Adding images to the site is an excellent way to illustrate what your page is about and attract your customers' attention. In the editor, you can upload your own pictures or choose free stock images using the keyword search. For more information check the article Adding images.
Besides that, the article Editing images will show you all the tools available in the editor that will help you fit your images into the overall site design — for example, add a filter, overlay color, or resize the placeholder of every your picture.
Tip: you can find the main steps for launching a website presented in more detail in our article Customizing a ready-to-use template.
For our further assistance, you can always contact our support team via the live chat or by emailing to support@devellp.com.
This article will show you the basic actions with your site blocks, how to work with your site elements, edit your text, and add your images.
Once you have opened your site's editor, you can see a toolbar at the top where the elements of navigation within your site editor are gathered:
Upon clicking on the tabs and links correspondingly, you will be able to navigate within your current site's editor its settings. Here is a brief note about the top editor panel:
( 1 ) My websites. This is a quick link back to your account's page where you can find a list of all of your sites in case you need to navigate from the current site to another one.
( 2 ) Site settings - self-explanatory: this drop down's options will take you away from the editor to the chosen section of the current site's setting.
( 3 ) Page management menu. Here you will find a button leading to the settings of the main site blocks, list of your site pages and pop-ups and, your site style settings.
Please note that the pages that are displayed here are visible solely in the editor and are not accessible to visitors until you link them to your site menu or other elements. To open the editing mode of a particular page, click on that page's tab in the list. Our article Adding pages will show you how to create wide navigation on your site.
( 4 ) Quick navigation between computer monitor and cellphone/tablet preview.
( 5 ) Undo and Redo buttons. They are to help you to quickly discard (and return back, if needed) a change you have just made in the editor. This will work only for the current session in the editor. To undo your site modifications made earlier than within this session and to restore a previous version of your site, we recommend using your site history (see below).
( 6 ) Autosave status. This section lets you know that all changes you have made so far are safe now.
( 7 ) Upgrade link. This is a quick access point to your site's upgrade page within the editor to take your site from its free/trial version to its fully functional Pro version. Preview your site to see how everything looks before pushing the changes you have applied to it live.
( 8 ) Preview your site as a visitor.
(9) Publish your site to make it look exactly how you see it in the editor.
(10) History Here you can manually create and store your different site versions and recover any of them when needed. It is very important to have a copy of your site before modifying it further. You can learn more about it in our dedicated article Site history.
(11) Comment mode. Review feedback on your published site from everywhere to take notes and see how great it is.
(12) Share your site's link with your colleagues or relatives to get a deeper insight about your website.
(13) Hide your editor's menu, - the very top row of your editor's top bar, - to allow a bit more space for yourself in the editor.
(14) Help. We always are just one click away from you to help you in building your online presence. Click this drop-down to get to our Help Center, get familiarized with the useful tips we have shared or, if you wish, order our site building services from our Design Studio professionals.
All of the above is so accessible!
The websites on Devellp are created with the help of the blocks — full-width sets of elements that are easily adaptable to different screen resolutions. We offer blocks for various business purposes — showcasing images, team presentation, products exposing, describing services, etc.
To place a new block on a page, check the article Adding blocks.
Tip: If none of our pre-made options in the gallery meets your needs, check the article Adding a custom block to see how you can create a block that fits your design needs from scratch.
See our video tutorial on how to work with the blocks below:
Basic actions with blocks
You can move, delete and hide, or duplicate a block to another page of your site.
Moreover, our blocks are easily customizable, so you can adjust their layout to match the overall design of the site. For more detailed information, follow the instructions in the article Changing the design of a block.
Basic actions with the elements in a block
Your texts, images, buttons, and other block contents are referred to as your site's elements. All elements have their own placeholders — an area they occupy in a block. You can also enrich the look of your blocks by adding additional elements to them — more buttons, lists, dividers, or social icons:
Each item has its own settings, but there are basic actions that can be applied universally — you can copy, delete or move them within the block they are added to.
Besides, elements are usually gathered in columns for quick customization. With the help of columns, you can easily adjust your content alignment or change the background in this specific part of the block. See the article Managing elements to learn more about the columns and the elements they contain.
Special types of blocks
Some blocks in the gallery have unique settings and behavior — for example, collections and lists. Each item in these blocks keeps the same layout as others. For example, if you delete an element from one list item in the collection, it will be automatically deleted from every other list item. This simplifies the editing process a lot!
Moreover, the collections can be turned into different modes. You can enable a slider mode with the navigation elements as well as organize the items with the help of tabs.
To replace a text existing in a template with your own, select it in the placeholder and enter your own content. Besides, you can add an additional text element in a block following the instructions in the article Adding elements. You can apply the regular settings to your texts available all elements — copying it, moving it anywhere within its block, and deleting your text.
To customize the display of your text — change its style, size, color, line height, alignment, and so on — select the text and choose an action in the pop-up menu:
The text font is automatically adjusted on your site, but if you want to change it, please refer to the article Changing site's font to know how to do it.
If you haven't found the font you were looking for in our gallery, you can upload your own following the instructions in the article Uploading your own font.
Adding images to the site is an excellent way to illustrate what your page is about and attract your customers' attention. In the editor, you can upload your own pictures or choose free stock images using the keyword search. For more information check the article Adding images.
Besides that, the article Editing images will show you all the tools available in the editor that will help you fit your images into the overall site design — for example, add a filter, overlay color, or resize the placeholder of every your picture.
Tip: you can find the main steps for launching a website presented in more detail in our article Customizing a ready-to-use template.
For our further assistance, you can always contact our support team via the live chat or by emailing to support@devellp.com.
Updated on: 03/17/2023
Thank you!