To see how this property works, we've created some sample sections to demonstrate how it can be used in your website.
1. The Creative way
2. Pricing Plans
BASIC
$49
5 Pages
500MB Storage
5 Photo Gallery
10MB Max file size
2 Custom domain
Automatic sitemap
10 Element Animation
30 Premium elements
10GB Bandwidth/month
ADVANCED
$99
5 Pages
500MB Storage
5 Photo Gallery
10MB Max file size
2 Custom domain
Automatic sitemap
10 Element Animation
30 Premium elements
10GB Bandwidth/month
PROFESSIONAL
$199
5 Pages
500MB Storage
5 Photo Gallery
10MB Max file size
2 Custom domain
Automatic sitemap
10 Element Animation
30 Premium elements
10GB Bandwidth/month
3. Documentations or Help Guides
Beginners Guide
Hello, and Welcome to Zoho Sites!
This beginner's guide will cover all of the necessary steps to create your first website. With our easy-to-use interface, creating a website has never been so simple.
By the time you reach the end of this guide, your site will be online and ready to go. Let's begin!
Getting Started
First, log in to Zoho Sites using your Zoho Account credentials. If you don't have an account with us, you'll need to create one.
To create an account:
- Go to sites.zoho.com.
- Enter an email address and password.
- Click Start Free Trial Now
Sections
Hover over the content area to access a particular section. Or click the content area and select a section from the dropdown list.
Note: Click the Add icon, then select +Element. Click Sections to access the sections content tray. From here, you can select and add sections with varying content layouts.
Preview
Publish
Note: You will need a domain name before your site goes live. An ideal domain name would be one which is specific to the nature of your website. If you do not have a domain already, you will need to configure one.
Post Publish Assistance
If you've followed all of the above instructions, your first website with us should be ready to go! However, if you ever find yourself in a fix, please don't hesitate to contact our 24/5 support team. Feel free to write to us at support@zohosites.com.
Now that you've created your site, you're ready to learn even more advanced tips. Next up, more info on customizing, collaborating, and configuring!
How It Works
The sticky property can be applied to the column and box elements. While scrolling, the element will remain fixed until it reaches its parent height. When the bottom of this element reaches its parent's maximum height, it will no longer appear fixed.
Ex1:Column element: The block with the green border that follows as you scroll is a column element. This content within the black border is its parent element. The column element has been made sticky, and its values are mentioned within. When you scroll, you will notice that the green box appears to be fixed until its base hits the base of the parent element.
Note :
- If both the element height and parent height are the same, it wont appear fixed.
- This feature can only be viewed on desktop devices of 992px or higher.
- The way this property works can only be viewed when you preview your site or publish it. This element cannot be tested on the builder.
- If you are placing sticky elements on top of each other, they may overlap. You can resolve this with the stack value feature.
- The element with the higher stack value will be on top. Set the stack values in descending order to avoid over lapping.
Enable Stickiness : True
Top Spacing : 20
Stack Value : 1
Ex2: Box element: The block with the green border is the box element. The block with the black border is its parent element. The box element has been made sticky, and its values are mentioned within. When you scroll, you will notice that the green box appears fixed until its base hits the base of the parent element.
Enable Stickiness : True
Top Spacing : 0
Stack Value : 1
Note :
- If both the element height and parent height are the same, it wont appear fixed.
- This feature can only be viewed on desktop devices of 992px or higher.
- The way this property works can only be viewed when you preview your site or publish it. This element cannot be tested on the builder.
- If you are placing sticky elements on top of each other, they may overlap. You can resolve this with the stack value feature.
- The element with the higher stack value will be on top. Set the stack values in descending order to avoid over lapping.