Manual Website Creation Print

  • 0

How to add custom HTML/JS/CSS code to a website? 

Option 1:

 

Adding HTML code:

Drag and drop "Advanced" from the main toolbar;

Choose "Custome HTML" composition;

Select the HTML code icon in the right toolbar and insert the code.

Customizing HTML code:

Size:

Adjust HTML code size or "Allow to adjust size automatically" in the right toolbar.

 

Option 2:

 

Adding custom script:

Go to "Settings" (on the top of the website builder);

Go to the "Pages" menu items there and switch to the "Scripts" tab;

Insert your code into one of 3 available fields:

"Before </head>" – inserts code in the ending of page/website section <head>

"Before </body>" – inserts code in the ending of page/website section <body>

"After </body>" – inserts code at the beginning of page/website section <body>

The script can be added either for the whole website (all pages) or for the exact page.

 

Published Store or Blog website has words in English

Some builder elements (e.g. "Store", "Store Cart", "Blog") may have their own built-in words and buttons with native words. Some values (e.g. "Add to Cart" or texts like "Price", "Category", etc) cannot be changed, and sometimes they are published in English language rather than the desired language.

 

The language of these words depends on the website language. The website language is determined in 2 ways:

 

When creating a multilingual website (using the country Flags element) — built-in words will be translated to a currently opened language on the published website.

When creating one language website (using no country Flags element) — language is determined by website builder language during publication.

Note: Make sure you have the builder switched to the needed language before publishing.


Custom HTML widget does not work

There can be many reasons for this issue. One of the reasons may be improper HTML code used in the widget.

Open the browser developer toolbar (key F12);

Switch to the "Console" tab, and check if there are red messages;

If there are, then you should check and fix your script according to those messages.

If you need help figuring it out, you may contact us by creating a ticket and describing the problem.

 

How to choose a template? 

  1. Login to your thebuzzr creator account and go to the My Websites page;
  2. Buy /connect your domain and click "Edit Website";
  3. Choose from templates available or create a website from "Blank Template".

How to change the template? 

  1. Login to your thebuzzr creator account and go to the My Websites page;
  2. Click "Edit Website";
  3. Click the "New/Reset" dropdown list at top of the builder;
  4. Select "Change template" and choose from the templates available or create a website from "Blank Template".

Note: All components disappear when the template is changed.

How to transfer website content from one domain to another?

Save backup:

  • Open your websites;
  • Open the builder with the original domain using the "Edit Website" button;
  • Save the website's backup by following step 1.

Restore backup:

  • Open the builder with the new domain using the "Edit Website" button;
  • Restore backup by following step 3.

How to create a landing page?

  1. If you don't have a website yet:
    • You can use the "Landing page" template;
  2. If you already have a website and want to create "Landing page" from it:
    • Сonnect the menu items with the necessary sections of your website by going through the steps (in step 4, use the part for "menu item").

How to use "Layout"? 

  1. Adding layout:
    • Drag and drop the layout from the main toolbar;
    • Choose layout composition;
    • Add elements to your layout;
    • If you have more than one layout you can add elements to each layout.
  2. Customizing layout:
    • Position:
      Change the element's position in the layout. Choose from "Horizontal Layout", "Vertical Layout" or "Floating Block" in right toolbar.
    • Alignment:
      Align elements in the layout by selecting alignment for that layout in the right toolbar.
    • Background:
      Select the layout and click the background  icon in the right toolbar;
      Choose your background layout colour and opacity;
      Or image/video – opacity, position, etc.
    • Duplicate:
      Add duplicate layouts by clicking on the icon on the layout you want duplicate and choosing "Duplicate".
    • Borders:
      Select the layout and click the border icon in the right toolbar to add borders to the layout and choose your width, style and colour.
    • Size:
      Adjust layout size or "Allow to adjust size automatically" in right toolbar.

How to use "Menu"? 

  1. Adding Menu:
    • Drag and drop Menu from the main toolbar;
    • Choose Menu composition;
    • Click "New Menu Item":
      • Select the type of menu item (e.g. "Page");
      • Enter "Name";
      • Select from the dropdown list "Copy layout from" (e.g. Home);
      • (Optional) Select section that needs to be clear;
      • Click "Apply".
  2. Customising Menu:
    • Select the type of menu item:
      • Page on your website.
        Select the page from the dropdown list.
      • Web Address.
        Enter URL.
      • File from your Website.
        Click and select a file from the gallery or "Upload New File".
      • E-mail address.
        Enter your e-mail address.
      • Phone Number.
        Enter the phone number together with the country code.
      • Popup.
        Select the popup page from the dropdown list or click to create "New Popup".
      • Empty.
        Leave the menu item empty.
    • Select additional options to "Open in a New Window", etc.
    • Submenu:
      Drag your created element to the required location or on top of a menu element to create a submenu.

How to add a new page?

  1. Adding a new page:
    • Select "Settings"  at top of the website builder and select "Pages";
    • Select "New Page";
    • Select page type;
    • Write page "Name";
    • Select from the dropdown menu which page layout to copy;
    • (Optional) Select section that needs to be clear;
    • Click "Apply".
  2. Customizing new page:
    • Make the page as home page, do not index or show a popup when the page is open;
    • Add SEO to your page:
      Title, description, etc.;
    • Add page background;
    • Add custom script.

How to see "Page Structure"? 

  • Click "Page Structure" at the top of the right toolbar;
  • You can see what layouts and elements "Header", "Body" and "Footer" have.
  • Select an element and drag and drop it to where you want to move it (e.g. select layout and drag and drop it in footer).

How to add files (ex.: .pdf, .docx, .xlsx, .mp3, .gif, etc.) to your website:

Types of files that can be added to your website:

Image:

'jpg', 'jpeg', 'gif', 'png', 'svg', 'webp'Video:

'ogg', 'mp4', 'mpeg', 'avi', 'flv', 'mkv', 'mov', 'webm'Favicon:

'jpg', 'jpeg', 'gif', 'png', 'ico', 'svg'Audio:

'mp3', 'aac', 'wav', 'ra', 'midi', 'ram', 'wma', 'ogg', 'ape'Other documents:

'pdf', 'docx', 'doc', 'xls', 'xlsx', 'rtf', 'ppt', 'pptx', 'odt', 'txt', 'csv', 'html', 'xml', 'js', 'yml', 'rar', 'zip', 'tar', 'gz', 'eps', 'cdr'

How to use alignment? 

  1. Select a Layout and type of layout in the right toolbar;
  2. Select alignment of your elements in layout;
  3. Select alignment for a vertical layout, if the horizontal layout and "Switch to vertical layout on smaller screens" is selected.

How to Save / Restore backup? 

  1. Save backup:
    • Open the builder with the initial domain using the "Edit website" button;
    • Select the "Publish" drop-down list and select "Backup / Restore";
    • Click the "Download Backup" button.
  2. Auto backup:
    • Go to the "Publish" dropdown list and select the "Backup / Restore" option;
    • Switch to the "Restore" tab and choose auto backup version to restore;
    • Auto backups are automatically saved every 5 minutes.
      The number of auto-backups per website is limited and it saves 50 copies by default.
      Only 50 newest copies are saved when the limit is reached.
  3. Restore backup:
    • Go to the "Publish" dropdown list and select the "Backup / Restore" option;
    • Select the "Restore" tab;
    • Click "Browse" and choose a downloaded backup from your computer;
      Or "Choose the auto backup version to restore"
    • Click "Restore".

 

How to Copy / Paste elements? 

  1. Select the element/layout you would like to copy;
  2. Click  in the top right corner of the element;
  3. Select copy and select layout in which you would to paste copied element/layout;
  4. Click  in the top right corner of the layout and select paste;

How to "Undo/Redo" your actions in the builder? 

  • Click the "Undo" button at the top of the builder to go back to the previous step;
  • Click the "Redo" button at the top of the builder to cancel undo action. This button only appears if you used "Undo".

How to duplicate elements? 

  1. Select the element/layout you would like to duplicate;
  2. Click  in the top right corner of the element;
  3. Select duplicated element and drag it to the section in which you would like it to appear.

How to add anchors? 

  1. Select an element by clicking on it;
  2. Choose the "Advanced" category in the right toolbar;
  3. Write "Anchor name" (e.g. anchor)
    (Optional) Write "Class name" and "Name";
  4. Select the element you want to link to anchor:
    • For menu items:
      • Select "Edit Menu" in the right toolbar;
      • Click on "New Menu Item";
      • Select "Link" and write "Name";
    • For image/button:
      • Click the icon below "URL" in the right toolbar;
    • For text:
      • Select the text part you need to add anchor;
      • Click the "Link" button in the text editor;
  5. Select "Page on your website";
  6. Choose the Anchor name from the dropdown list;
  7. Click on "Apply".

How to add animations to your website? 

You can add animations on all elements on your website:

  1. Click on an element in the builder that will have animations;
  2. Select the "Animation" section in the right toolbar;
  3. Select the "Effect" type (e.g. Fade in, Bounce in, Zoom in) and edit its properties if needed:
    • Direction;
    • Duration;
    • Delay;
    • Loop.
  4. Set effect on "Default" or/and on "Hover".

How to use styles? 

Set text style for your website builder.

  1. Select "Settings" and "Styles" at the top right of the website builder;
  2. Select text style and select font, size, etc.;
  3. Select "Links" and set the link text colour and link hover;
  4. Select "Advanced" to adjust additional features.

How to use "Favicon"? 

  1. Select "Settings" at the top of the builder;
  2. Select "Favicon";
  3. Click favicon ;
  4. Click "Add New" / "Upload New Picture" or drag and drop the file to upload or change the favicon;
  5.  

Click "Apply".

How to publish a website? 

  1. Login to your thebuzzr creator account;
  2. Go to My Websites;
  3. Click "Edit Website" button next to the domain you would like to publish;
  4. Make necessary changes to your website;
  5. Click "Publish" website at top of the builder to make your website visible to public;
  6. You can publish an "Under Construction" template of the website while you create your website.

How to reset the template? 

  1. Click the "New / Reset" dropdown list at top of the builder;
  2. Select "Reset" and start from the beginning.

Note: All your current progress will be lost if you choose to reset the template.

How to manage a cookie policy? 

  • Adding Cookie policy:
    1. Go to "Settings" at the top of the builder and select "Settings";
    2. Select "Cookie policy";
    3. Click on "Enable cookie policy block".
    4. Click on "Add new";
      These cookies will be loaded only after the visitor consents;
    5. Write "Cookie name" and "Cookie description";
    6. If necessary, check the box "Required functional cookie";
      In this case, this cookie will be required.
  • Customising Cookie policy:
    1. Write button text;
    2. Write customize button text;
    3. Select text font, size, background, message colour, button colour and button text colour;
    4. Write a cookie policy message.
    5. Click "Apply".

How to preview your website? 

  1. Click "Preview" at top of the website builder;
  2. You can see how your website will look online through different formats (e.g. desktop);
  3. Click "Close preview" at the top right corner to close the preview window.

How to make your website responsive? 

Your websites are automatically created to look good on all devices.

To check your website responsiveness:

  • Select different size screens just above your website content;
  • Select preview.
    Select different size screens to see how it looks.

How to manage elements' visibility? 

Elements visibility can be managed for:

  1. Devices:
    • Select an element/layout/page section;
    • Select "Visibility" on the right toolbar;
    • Choose devices that you want to show/hide selected element/layouts.
  2. Pages:
    • Select element/layout / page section;
    • Select "Visibility" on the right toolbar;
    • Choose "Show on the current page only", "Show all pages" or "Show specific pages".

How to have different layout backgrounds on different devices? 

  1. Select a layout you want to adjust;
  2. Select the layout colour by clicking Background  in the right toolbar;
  3. Select layout colour or image/video for the background;
  4. Select "Visibility" in the right toolbar;
  5. Select devices that you want your layout to appear in (e.g. a widescreen, desktop, and tablet);
  6. Select a different size of the screen above your website content (e.g. phone);
  7. Insert another layout in the same position where the previous one was;
  8. Select that layout and choose layout colour by clicking "Background"  in the right toolbar;
  9. Select different layout colour or image/video for the background;
  10. Select "Visibility" in the right toolbar and set it to show for that layout only (e.g. phone).

How to create a function to download a file?

  • Select the element that will be used to download a file (example: image, button, text);
  • Select the "Advanced" tab in the right toolbar;
  • Find "URL" on the tab;
  • Click next to the "No link selected"  button;
  • Select "File from your Website";
  • Click  button;
  • Click "Upload New File";
  • Choose the necessary file from the computer;
  • Click "Select";
  • Click "Apply".

How to use multiple selections?

  1. Press Ctrl / Cmd key on your keyboard and select the elements you want to edit;
  2. Make changes to selected elements in the right toolbar.

Note: If you choose the same category elements you will have more features to edit.

All my components (text, photos, buttons, etc.) disappeared when I changed the template

Each template has its own default elements and each element is placed differently per template.

So, after changing the template, your created website will be lost.

How to edit my website while the "Under construction" page is online?

The website has not been created:

  1. Select the required "Under Construction" template;
  2. Edit website;
  3. Click "Publish" at the top of the website builder;
  4. Click the "New / Reset" dropdown list at the top of the website builder and select "Change template";
  5. Select a new template;
  6. Select the checkbox "Got it" and click "Yes, change template";
  7. Edit your website, but don't publish it until it's finished.
    Use the "Preview" button to view your website.
    Select the "Publish" dropdown list at the top of the website builder and select "Save Draft" to save your progress.

Hiding the website while it is being created/updated:

  1. Save a backup of your current website;
  2. Select the "New / Reset" dropdown list at the top of the website builder and select "Change template";
  3. Select the "Under Construction" template;
  4. Select the checkbox "Got it" and click "Yes, change template";
  5. Edit website;
  6. Select the "Publish" dropdown list at the top of the website builder and select the "Backup / Restore" option;
  7. Restore the backup of the website you want to continue editing;
  8. Edit your website, but don't publish it until it's finished.
    Use the "Preview" button to view your website.
    Select the "Publish" dropdown list at the top of the website builder and select "Save Draft" to save your progress.

Element is visible in the website builder but not visible in the preview

  1. Select an element you want to edit;
  2. Select "Visibility" in the right toolbar;
  3. If an element is not visible but should be:
    • Select devices that you want your element to appear in.
  4. If it is still not appearing in the preview:
    • Find the element in the Horizontal / Vertical (parental) layout and check for its "Visibility" option;
    • Select the layout's visibility for necessary devices so its inner element would be also visible in the preview.

 


Was this answer helpful?

« Back

Powered by WHMCompleteSolution