How to make your own weebly website.
The eight articles in this section make up the Beginner's Guide to Weebly. If you're just getting started, we recommend taking time to go through each of these short articles. By the time you're done, you'll be ready to build a great first site.
First of all go to www.weebly.com and creat a acount then do these following steps. This page is supported by weebly.
First Steps
First Steps Weebly is the easiest way to build your own website. But that doesn’t mean you can’t use some help getting to know your way around. All the basics you need in order to put together your first (and second, third, fourth - even seventeenth) site can be found over these next several pages. Take a few minutes to read this guide, or watch the handy video, and you’ll be an expert in about the time it takes to fix a nice breakfast.
Let's get to it and build a site!
The Site Title
Every site needs to have a title, which is what it's the first thing we ask for when you create a new site. This title can be easily changed later, so don’t worry too much about it here. I'm going to call this site "My Fantastic Site" for now.
First of all go to www.weebly.com and creat a acount then do these following steps. This page is supported by weebly.
First Steps
First Steps Weebly is the easiest way to build your own website. But that doesn’t mean you can’t use some help getting to know your way around. All the basics you need in order to put together your first (and second, third, fourth - even seventeenth) site can be found over these next several pages. Take a few minutes to read this guide, or watch the handy video, and you’ll be an expert in about the time it takes to fix a nice breakfast.
Let's get to it and build a site!
The Site Title
Every site needs to have a title, which is what it's the first thing we ask for when you create a new site. This title can be easily changed later, so don’t worry too much about it here. I'm going to call this site "My Fantastic Site" for now.
The Web Address
Every site must also have an address (like www.weebly.com for example) so that your visitors can find it. You have three options for choosing an address, and the address, like the title, can be very easily changed at any time:
With these first steps done, your new site should look very similar to the picture below
Every site must also have an address (like www.weebly.com for example) so that your visitors can find it. You have three options for choosing an address, and the address, like the title, can be very easily changed at any time:
- Option 1: Use a Subdomain of Weebly.com - This is an address like yoursite.weebly.com. Completely free to use.
- Option 2: Register a New Domain - If you want your own personal domain (like www.amazon.com or www.richardsomething.com), you can pay to register it with this option.
- Option 3: Use a Domain You Already Own - If you already own a domain that you’ve previously purchased through Weebly or another provider, you can enter it here.
With these first steps done, your new site should look very similar to the picture below
You're now ready to start building your site. In the process of building your site (and reading this guide) you'll be working with:
Elements
Elements are the basic building blocks of your site. All of your site content, be it text, pictures, videos or what have you, is added via an element.
Pages
Your site can have as many pages and sub-pages as you want as there are no page limits for either free or paid accounts. We’ll be adding several pages (including a blog) to our test site in this guide.
Themes / Design
You can select from any one of a number of themes and switch to a different theme at any time. This affects the look of your site. All of your pages and elements remain in place, no matter what theme you choose. We’ll switch themes and take a close look at the theme options (like changing fonts) towards the end of the guide.
Elements
Elements are the basic building blocks of your site. All of your site content, be it text, pictures, videos or what have you, is added via an element.
Pages
Your site can have as many pages and sub-pages as you want as there are no page limits for either free or paid accounts. We’ll be adding several pages (including a blog) to our test site in this guide.
Themes / Design
You can select from any one of a number of themes and switch to a different theme at any time. This affects the look of your site. All of your pages and elements remain in place, no matter what theme you choose. We’ll switch themes and take a close look at the theme options (like changing fonts) towards the end of the guide.
This is the part about how to do your elements. Without these your website would be boring withe a capital B.
Text Elements
Adding an element to a site is as simple as clicking on that element and dragging it to the content area of a page. Let's drag the most basic element - the paragraph element - to this sample site.
Text Elements
Adding an element to a site is as simple as clicking on that element and dragging it to the content area of a page. Let's drag the most basic element - the paragraph element - to this sample site.
The paragraph element is exactly what it sounds like - an element for writing text. You can write a word, a sentence or multiple paragraphs in a single element. Just click within the element to start editing.
As you write your text, take notice of the blue toolbar at the top of the editor. Every element has its own toolbar with functions specific to that element.
The text toolbar enables you to (from left to right) Bold, Italicize, Underline, change the color, increase the size and decrease the size of selected text. You can also create a link (we'll take a closer look at this a bit later) to another site, a page within your own site, an email address or an uploaded file.
Beyond that you can align all the text in an element to the left, center or right, create both bulleted lists and numbered lists, and also undo / redo changes.
One thing you may notice you can't do is change fonts. That's because the font is controlled through the site's theme and not within individual elements. You can change the default font for different areas of your site via the Design tab, and we'll take a closer look at this a bit later in the guide.
When writing your text, avoid copying / pasting from word processors like Microsoft Word. These applications format their text in a way that doesn't work well with a website and you could end up with weird text issues if you paste straight from a Word doc. If you write your text in this sort of application be sure to save your file as Plain Text before you copy / paste to Weebly. You can do this in most applications by going to File > Save As. Doing so will ensure your text editing process is a peachy one.
The text toolbar enables you to (from left to right) Bold, Italicize, Underline, change the color, increase the size and decrease the size of selected text. You can also create a link (we'll take a closer look at this a bit later) to another site, a page within your own site, an email address or an uploaded file.
Beyond that you can align all the text in an element to the left, center or right, create both bulleted lists and numbered lists, and also undo / redo changes.
One thing you may notice you can't do is change fonts. That's because the font is controlled through the site's theme and not within individual elements. You can change the default font for different areas of your site via the Design tab, and we'll take a closer look at this a bit later in the guide.
When writing your text, avoid copying / pasting from word processors like Microsoft Word. These applications format their text in a way that doesn't work well with a website and you could end up with weird text issues if you paste straight from a Word doc. If you write your text in this sort of application be sure to save your file as Plain Text before you copy / paste to Weebly. You can do this in most applications by going to File > Save As. Doing so will ensure your text editing process is a peachy one.
To add more text we could keep writing in this same element, add another paragraph element to the page, or use one of the three other text elements:
Now, what about adding images to the site?
Image Elements
There are three elements that can be used to add images to a site. The above mentioned paragraph with picture element, as well as:
- Title - Used for adding titles / headers to a page.
- Paragraph w/ Title - A paragraph element with a spot for title already built in.
- Paragraph w/ Picture - A paragraph element with a spot for both a title and an image built in.
Now, what about adding images to the site?
Image Elements
There are three elements that can be used to add images to a site. The above mentioned paragraph with picture element, as well as:
- The picture element - Upload one image per element.
- The picture gallery element - Upload as many pictures as you like to create a gallery of clickable images.
Uploading an image to a picture element is as simple as clicking the big blue Sample Image. This opens a file browser on your computer through which you can find the image you want to upload.
As with the text element, when you select and upload the image you want, you'll see a blue editing toolbar at the top of the editor.
Use this toolbar (from left-to-right) to upload a new image, set a border size (or no border at all), select a gray or black border, position the image to the left / center / right of the element, enter a caption, link the image elsewhere (or to a larger version of the same image) and use the Advanced option to set the margins around the image and enter Alt Text if needed.
Re-size images by clicking and dragging the box found on the lower-right-corner of each
Each element we've added is stacked above or beneath another element like a column of building blocks. Elements stack on top of one another by default within the editor. But what if we want to place two or more elements side-by-side?
Alter the Layout of a Page with the 2 Column Element
By default, the content area of a page allows you only to stack elements one on top of another. No matter how many times you try to drag an element alongside another element, it will always end up above or below that element. This works great, unless you want to line up some of your elements side-by-side in multiple columns. That's where the Two Column Layout comes in.
As with the text element, when you select and upload the image you want, you'll see a blue editing toolbar at the top of the editor.
Use this toolbar (from left-to-right) to upload a new image, set a border size (or no border at all), select a gray or black border, position the image to the left / center / right of the element, enter a caption, link the image elsewhere (or to a larger version of the same image) and use the Advanced option to set the margins around the image and enter Alt Text if needed.
Re-size images by clicking and dragging the box found on the lower-right-corner of each
Each element we've added is stacked above or beneath another element like a column of building blocks. Elements stack on top of one another by default within the editor. But what if we want to place two or more elements side-by-side?
Alter the Layout of a Page with the 2 Column Element
By default, the content area of a page allows you only to stack elements one on top of another. No matter how many times you try to drag an element alongside another element, it will always end up above or below that element. This works great, unless you want to line up some of your elements side-by-side in multiple columns. That's where the Two Column Layout comes in.
The Two Column Layout Element works like any other element: just drag it to a page. It will stack above or beneath any other elements you've already placed on that page and is quite literally made up of two empty columns separated by a blue bar.
This blue bar can be clicked and dragged to the right or left to increase / decrease the size of a column. Note that this bar does not appear on your published site, so your beautiful content will not be marred by a blue bar running down the middle.
Adding content to one of the columns is as simple as dragging that content into the column.
Moving an element is as simple clicking and then dragging on the blue bar at the top of the element.
I've placed each of the images we uploaded earlier in this guide into its own column.
A column can contain more than just one element - you can put as many elements as you like in each column - so let's place a title element above each of these pictures. You can drag content straight down from the element toolbar and into a column
Now let's learn how to creat more pages. It is never fun with a one paged website.
Create More Pages for Your Site
Whether you're a free user or a subscriber to our Pro service, your site can have as many pages and sub-pages as needed. We place no limits whatsoever on the number of pages that can be added to a site. Creating a new page is as simple as going to the Pages tab and clicking the New Page button.
This blue bar can be clicked and dragged to the right or left to increase / decrease the size of a column. Note that this bar does not appear on your published site, so your beautiful content will not be marred by a blue bar running down the middle.
Adding content to one of the columns is as simple as dragging that content into the column.
Moving an element is as simple clicking and then dragging on the blue bar at the top of the element.
I've placed each of the images we uploaded earlier in this guide into its own column.
A column can contain more than just one element - you can put as many elements as you like in each column - so let's place a title element above each of these pictures. You can drag content straight down from the element toolbar and into a column
Now let's learn how to creat more pages. It is never fun with a one paged website.
Create More Pages for Your Site
Whether you're a free user or a subscriber to our Pro service, your site can have as many pages and sub-pages as needed. We place no limits whatsoever on the number of pages that can be added to a site. Creating a new page is as simple as going to the Pages tab and clicking the New Page button.
There is an option to create a New Page or a New Blog. For now let's focus on just creating New Pages.
Clicking the New Page button adds a new page to your list.
Working from top-to-bottom you can:
Let's add several new pages to the example site (clicking New Page again will add another page and save the changes to the page you were working on): a page for a photography portfolio, an e-commerce page where visitors can schedule and pay for sessions, and a Contact Me page where we can place a contact form later.
You can re-arrange the order of the pages by clicking and dragging them up and down the list. Dragging a page to the top of the list will make that page your Home, which is indicated by the house icon to the far right of the page name.
Under the portfolio, let's also add two sub-pages for a portrait portfolio and a dance portfolio. Sub-pages appear in the site navigation menu as part of a drop-down menu for whatever page they're connected to (well see how this looks in a moment).
Sub-pages start as regular pages created via the New Page button.
To make them sub-pages, just drag them underneath the appropriate page and then drag them to the right until you see each one connected to the main page via a dotted line.We are now going to skip ahead for ore help go to www.weebly.com
Start a New Blog
To create a blog, go to the Pages tab of the editor and click the New Blog button.
This will add the blog to your list of pages.
Give the blog a name and then click Edit Page to start adding content.
A new blog starts with a sample post (that you can either edit or delete) and a sidebar with some default content that you can easily change.
To create a new post for your blog, use the New Post button at the top of the blog itself.
Your blog post has a title and a content area. The title should generally be short - no more than a sentence long or so. The content area includes a basic paragraph element which you can either edit or delete. Adding content to a blog post works the same way as adding content to a regular page - just drag elements into the post and edit them to add content. Once you've added your content you can categorize the post - these categories will appear on your sidebar, making it easier for visitors to your blog to find posts that cover certain topics. Categories can be whatever you like and it isn't necessary to use them. Now you can Publish the post to your live site (which will make it instantly available) or Save to Drafts to edit / publish it later. If you save the post as a draft, it'll be accessible to you through a drafts area at the top of the blog page from within the editor (along with any other drafts you've saved). Just click the link to the post from this drafts area to edit it further and save / Publish. Every new post you Publish will appear at the very top of the page, pushing older posts further down the page. After you've added seven or eight posts to the page, older posts will be moved off the main page to still accessible archive pages.
Publish Your Site and Next Steps
Now that you've added some basic content to your site, you're ready to Publish it. To do so, just use the Publish button in the upper right corner of the editor.
This will bring up a verification box, letting you know your site has been Published.
You can click the Published address to view your site (you can also give this address out so that other people can use it to visit your site), use the Facebook and Twitter buttons to link your friends and followers at either provider to your site, and click the "x" in the corner of the box to close the box and continue editing your site.
You are also given the option to buy a personal domain if you don't already own one.
Of course, you are probably not done with your site at this point, and that's OK. You can continue to add content through the editor whenever you like and then click the Publish button to push that content to your live site.
Thoes are the basics.
Clicking the New Page button adds a new page to your list.
Working from top-to-bottom you can:
- Change the Page's Name
- Edit the Page (which will take you back to the elements area of the editor that we've previously been looking at)
- Copy the Page to use as the basis for a new page
- Delete the Page
- Set the Show in Navigation Menu option to Yes or No. Pages set to Yes are accessible via the site's navigation, pages set to No are hidden from the navigation (though you can create your own links to hidden pages)
- Turn on Password Protection, which requires a subscription to our Pro service
- Adjust the Advanced Settings
Let's add several new pages to the example site (clicking New Page again will add another page and save the changes to the page you were working on): a page for a photography portfolio, an e-commerce page where visitors can schedule and pay for sessions, and a Contact Me page where we can place a contact form later.
You can re-arrange the order of the pages by clicking and dragging them up and down the list. Dragging a page to the top of the list will make that page your Home, which is indicated by the house icon to the far right of the page name.
Under the portfolio, let's also add two sub-pages for a portrait portfolio and a dance portfolio. Sub-pages appear in the site navigation menu as part of a drop-down menu for whatever page they're connected to (well see how this looks in a moment).
Sub-pages start as regular pages created via the New Page button.
To make them sub-pages, just drag them underneath the appropriate page and then drag them to the right until you see each one connected to the main page via a dotted line.We are now going to skip ahead for ore help go to www.weebly.com
Start a New Blog
To create a blog, go to the Pages tab of the editor and click the New Blog button.
This will add the blog to your list of pages.
Give the blog a name and then click Edit Page to start adding content.
A new blog starts with a sample post (that you can either edit or delete) and a sidebar with some default content that you can easily change.
To create a new post for your blog, use the New Post button at the top of the blog itself.
Your blog post has a title and a content area. The title should generally be short - no more than a sentence long or so. The content area includes a basic paragraph element which you can either edit or delete. Adding content to a blog post works the same way as adding content to a regular page - just drag elements into the post and edit them to add content. Once you've added your content you can categorize the post - these categories will appear on your sidebar, making it easier for visitors to your blog to find posts that cover certain topics. Categories can be whatever you like and it isn't necessary to use them. Now you can Publish the post to your live site (which will make it instantly available) or Save to Drafts to edit / publish it later. If you save the post as a draft, it'll be accessible to you through a drafts area at the top of the blog page from within the editor (along with any other drafts you've saved). Just click the link to the post from this drafts area to edit it further and save / Publish. Every new post you Publish will appear at the very top of the page, pushing older posts further down the page. After you've added seven or eight posts to the page, older posts will be moved off the main page to still accessible archive pages.
Publish Your Site and Next Steps
Now that you've added some basic content to your site, you're ready to Publish it. To do so, just use the Publish button in the upper right corner of the editor.
This will bring up a verification box, letting you know your site has been Published.
You can click the Published address to view your site (you can also give this address out so that other people can use it to visit your site), use the Facebook and Twitter buttons to link your friends and followers at either provider to your site, and click the "x" in the corner of the box to close the box and continue editing your site.
You are also given the option to buy a personal domain if you don't already own one.
Of course, you are probably not done with your site at this point, and that's OK. You can continue to add content through the editor whenever you like and then click the Publish button to push that content to your live site.
Thoes are the basics.
Videos
Here are some videos to also help you build your own weebly website. There are some things here that are not there.It is a little out of date.