Element
Elements are the smallest components of a web page.
Header
The uppermost part of a website which consists of the site title and the navigation bar.
Click the pencil icon to set up the header.
Site title & logo
- Select "Site Title".
- Click the pencil icon.
- Select "Site title & logo".
- Customize your site title and logo through the options below:
- Site title
- Enable "Site Title".
- Edit your site title: enter your site title in the text field.
- Choose the font size for your site title: Anyweb provides three font sizes for site titles.
- Logo
- Enable "Logo".
- Edit/Add logo image: click "Add Image" to add a logo image.
- Modify logo size: drag to change the size of the logo (20 px – 320 px)
Layout
- Select "+" in the left navigation pane.
- Select "Site Title".
- Click the pencil icon.
- Select "Layout".
- Customize your header layout through the options below:
- Make header sticky: enable this option to stick the header to the top.
- Modify header position: click the arrow to expand the list and select the header position you prefer.
- Navigation title spacing: drag to change the title spacing in the navigation bar (20 px – 64 px).
- Padding (Top/Bottom): drag to change the top/bottom padding of the site title (8 px – 128 px).
Style
- If you want your site title to be transparent
- Enable "Transparent".
- Select the header text color, hover color, and select color.
- If you want your site title to be opaque
- Disable "Transparent".
- Select a background color or click "Custom color" to customize the background color.
- Select the header text color, hover color, and select color.
Text
We provide headline and paragraph elements.
- Select Elements in the left navigation pane.
- Select the Headline/Paragraph component under "Text".
- Drag the component to the canvas.
- Select the component.
- Click the pencil icon.
- Customize this component through the options below:
- Modify the style: select the text you want to format and click "Paragraph" to modify the text style. Anyweb currently offers one heading style and three paragraph styles.
- Format the text: you can use the four options on the right-hand side of "Paragraph" to embolden, italicize, underline, or shade your text.
- Add hyperlinks: select the text you want to add a hyperlink for and click 🔗 to add/modify a hyperlink.
Button
We provide two types of buttons: primary and secondary.
- Select "Elements" in the left navigation pane.
- Select the "Primary button/Secondary button" component under "Button".
- Drag the component to the canvas.
- Select the component.
- Click the pencil icon.
- Customize this component through the options below:
General settings
- Button caption: click to edit the button's caption.
- Jump to: in-site pages or external pages.
- Open link in new tab: choose whether to open a link in a new tab.
- Modify button size: Anyweb provides three sizes of buttons, i.e., small, medium, and large.
- Customize width: go to "Customize Width" and drag to modify the button's width (36 px – 999 px).
Design settings
- Alignment: choose how buttons are aligned to the top/bottom.
- Button style: select a button style (Primary button or Secondary button).
- Color customization
- Customize button colors
- Set pre-click and post-click button colors.
- Edit button caption colors
- Set pre-click and post-click button caption colors.
- Customize button colors
Image
Supported formats: JPG, PNG, and GIF | Maximum file size: 20 MB
- Select "Elements" in the left navigation pane.
- Click the "Image" component.
- Drag the component to the canvas.
- Select the component.
- Click the pencil icon.
- Customize this component through the options below:
Content
- Add image: select and add images.
- Crop image: crop images to adapt to the web page.
- Show caption: enable "Show Caption" to show image captions.
- Alt text: for blind or visually impaired readers and for image searches via text.
Design
- Corner radius: drag to modify the corner radius (0 px – 999 px).
- Resize: resize an image to either spread or adapt it to a certain area.
- Padding: use "Padding" to set the white space for images.
Link
- Link To: set the linked page (in-site pages or external pages) that the user will be redirected to by clicking the image.
- Open link in new tab: choose whether to open a link in a new tab.
Video
Supported formats: MP4, MPEG, and AVI | Maximum file size: 200 MB
- Select "Elements" in the left navigation pane.
- Click the "Video" component.
- Drag the component to the canvas.
- Select the component.
- Click the pencil icon.
- Customize this component through the options below:
Content
- Add video
- Add a video: upload a local video from your computer.
- Add video via YouTube: upload a YouTube video via URL.
- Add video via Vimeo: upload a Vimeo video via URL.
- Autoplay: enable "Autoplay" to start playing the video as soon as the user sees the playback interface.
Design
- Cover: click "Add Image" to add a cover image for the video (supported formats: JPG, PNG, and GIF; maximum file size: 20 MB).
- Caption: enable "Caption" to add a description for the video. You can format your video descriptions by choosing the paragraph style and alignment as well as whether to embolden, italicize, underline, or highlight certain text.
- Padding: use "Padding" to set the white space for videos.
Form
To collect the informationof visitors.
- Select "Form" in the left navigation pane.
- Click the "Form" component.
- Drag it onto the canvas.
- Select the component.
- Click the pencil icon.
- Customize this component through the options below:
General
- Form name: edit the name of the form.
- Button text: edit the button text in the form.
- Button alignment: set the button positions in the form.
- When a visitor submits a form
- Show message: you can edit the content of the message when the visitor submits a form.
- Link to page
Fields
Set up fields in the form.
- Basic settings: click to expand the settings
- Name
- Set the prompt for the given name field.
- Set the prompt for the family name field.
- Required field: if enabled, this field will be displayed to visitors.
- Email
- Set the prompt for the email field.
- Required field: if enabled, this field will be displayed to visitors.
- Text area: collect multi-line text information from visitors.
- Field tags: if there is more than one text field, we recommend adding tags to distinguish between different fields.
- Set the prompt for the text field.
- Required field: if enabled, this field will be displayed to visitors.
- Name
- Add new field
- Text: collect single-line text information from visitors.
- Multiple choice
- Single choice
- True/False
Design
- Button color (normal): the color of the form button when it is not clicked.
- Button color (hover): the color of the form button when it is clicked.
- Form style: click to select the form style you want.
- Padding: use "Padding" to set the white space for forms.
- Add background: set the form's background color; you can choose from the theme colors or customize the color.
Was this helpful? Click here to give us feedback.