Avada Manual

The Avada Manual

We will use the Avada theme in this tutorial. UberMenu automatically recognizes and integrates Avada as your main menu. Avada WordPress en EspaƱol. On this occasion I will bring you a Spanish Avada course so that you can configure Avada step by step.

Creating a Website with the Avada Topic

Log in to your SiteGround site accounts and click the My Accounts tab. Then click on the "Go to cPanel" pushbutton. Pick a log for your website and determine whether you want to view the www. or not when visitors to your website. When you have purchased an SSL for your domains, you can switch between the SSL certificates of https:// each time.

The next step, if you have more than one domains in your profile, is to browse to the one where you want to install WordPress. Specify an admin username. Pick something special. Pick a sophisticated and unambiguous one. There is no need to pick a topic as we will use our own topic to create our website.

Select the Post Name checkbox. As soon as you have WordPress on your website and have it set up, it's your turn to download a design. The WordPress word is the subject that gives your website its look. A few designs are still designs with little or no controls over layouts, colours, and styles. A few topics give you all kinds of controls over layouts, colours and styles.

We will use the Avada topic in this Tutorial. Like you saw in the movie, this design allows you to make many different looks for your website. Please click here to test the Avada topic for yourself. Click on the above hyperlink to go directly to the Avada topic page on the Forest Marketplace.

As soon as you have bought the Avada themed in the Topic Forrest, you will see it under the Downloads section of your account. So if the size of the files you were downloading was more like 200 megabytes, you will need to extract that and find the Avada.zip files that you can post to your website. Zip up the Avada themes files.

Installation and activation of the topic after upload. This will take you to a monitor where you will be prompted to download the necessary topic plug-ins. We have now our topic set up, it is our turn to begin the construction of our website. What makes Page builder topics great, and Avada in particular, is the possibility to create and customise the look and feel of your website and every single page on your website.

They can get a little help from the creators who created the Avada themes demo. About how I got some hints from the Avada Demo Page Designer. The Avada menu has a tabs named "Install Demos". If you' re willing to get more added to your website or get bogged down, think about taking a look at some of the great Avada themes demonstrations and seeing how their creators got the looks they made.

My first thought when I set up a website is to set up the colours to reflect the corporate or organisational image for which the website is being made. I' ll support the major colours of the website highlights with the colour of the hotel logos.

From the Avada menu above or in the Dashboard. Choose Topic Options and then the Logon page. If you want to delete the Avada standard icon, click here. Load up your logotype. Standard colours of the Avada themed highlights are a luminous shade of lush greens. It makes it really simple to see where we need to switch the theme's standard colours to the colours we want to use.

From the Avada topic Optionen, go to the Styling page. Choose a design skin above. It is the primary wallpaper colour of your website. Option are bright or dim. Either a bright or black backdrop is provided for the primary site. Next choice is the predefined colour schemes.

This is a setup you can try out, but I suggest you just leave it as it is and change your pages manual to emphasize them. Note that once you have modified the colours of your website by hand, you do not want to choose an item from the colour theme as this will delete any user-defined changes you have made.

Choose the section Wallpaper colours on the Style page. Modify all vibrant greens to your prime highlights colour. You' ll notice that on the Style page, you need to modify the colours under Wallpaper colours, Element colours and Colours in the main menu. The rest has plain colours.

Next colours we need to modify are the colours of the standard design integrated button. On the Shortcodes page, open the Shortcode button section. Browse down to the colours Button Top Colour and Button Bottom Colour. If you want your keys to have a history, then select a different top and bottom.

When you want your key to have only one uniform colour, select the same colour for top and bottom. The next step is to select a pushbutton named Hiover-Colours. When you want to use 3D-styled icons, modify the icon slope colour. Once you have made these changes, be sure to click the Remember all changes icon!

Avada themes offer many ways to create a customized look for your website, plus a comprehensive range of customization features to customize the look and feel of your website. You' ll find the type face setting in the Avada menu under Topic Option and then on the Type Face page. The Avada topic has a standard caption on each page.

This can be done under Topic Option > Delete Page Title and then under Hide Page Title Bar. When you have completed the configuration of the standard topic preferences, browse to the bottom of the Topic Option page and click the Back Up button. Pick the pages on the leftside.

Go to Preferences in the Dashboard drop-down list and then Read. Select the option in the Front Panel Display section: For your title page, select the "Home" page you just made, and for the Posts page, select the "Blog" page you just made. Set up a full-screen head picture on our homepage.

The creation of a full-window headers picture or movie has become a favorite and efficient way to add a nice styling to your website. When you know the right attitudes and the right utilities, this is something that is easily achieved with the Avada theming. The first time the topic was downloaded, it was already there.

Using a slide control, we can select whether we want to use several full frame frames or only one fixed frame. For this example we will only use a fixed picture. Looking down, look at the bottom of the Fusion Slider's sliders control panel and select the desired sliders. The Parallax scroll effect was also chosen because I liked the look of the bottom contents when I scrolled over the cover picture.

Under Fusion Slider on the menu on the far right of your desktop, choose Add or Edit Slides. Choose a background of the image that is the standard one. Enter the desired content as header for this transparency. Make sure that the heading background is Yes, which should be the case by setting it to Yes.

It will help keep our text separated from our wallpaper, making it easy for our audience to use. The next step, if you want to include one or two pushbuttons in your slideshow, is to do so in the Settings section. Below slidelink you can select if you want to hyperlink the whole slides to one location or if you want to have 1 or 2 badges linking to other sites.

When you select Buttons, the standard keyboard shortcut fills the Buttons #1 and #2 boxes. Incorporates by preference the highlighting colours you have already added to your website. In order to insert a shortcut into the speed dial number, look at the very beginning of the shortcut where it is located, click on the shortcut label = "", type in the address to which you want to insert the shortcut.

The next thing to look at is the very last part of the shortcut where it says: Text button[/button]. Substitute the words Text with the words you want the buttons to show. Clear the whole short code of #2, because in this example we will have only 1 buttom.

The next and most important thing is to put the picture on our film. At the top of the screen is the right side of the slideshow and there is a field called Features Images. Press the Set featured image pushbutton. It is recommended to upload an optimised picture of approx. 1400px width and a 500 - 900 high.

Whatever you type into the picture, it will scale itself to match your viewer's screen. Once uploaded, click the Set featured image icon at the bottom right of the screen. A field with the inscription is located above the field of Featured Images. From the WordPress Dashboard, go to the pages in the menus on the right.

Choose the home page that you previously made. Browse down and you will see a check mark labelled Fusion Page Options. The topmost page is namedlider. Choose this option. Normally the slide bar should be in the right place, or you can choose below. You should choose Fusion Sender as the type of slide.

Choose Fusion Slider and the Home or Home Page slider we have designed should be the same. We now have a full picture. All it would do to make it look better would be to delete the wallpaper colour from the headers and menus. Browse down to the fusion page options.

Choose the tab page Head. Locate the Background Opacity section and change it to 0. Scroll up and click in the Publish field on upd. Hint: If you have activated the sticksy headers, which is the case by standard, your menus always remain at the top of the screen. Create a homepage with the Avada topic using Fusion Builder.

Browse to the page editors and choose the start page. Click the Full Width Containers pushbutton with the column options chosen to apply a full-width box to your page. Append an artwork wallpaper to this section by selecting the Stylus tip symbol from the new Full width Container upper pane.

At the top, click the Background page. Then, in the Background Image section, click Upload. At the bottom right, click the Paste to Page icon. In the Fusion Builder field at the top, click the Builder Elements tool. Click the Image Frame item and drop it into the Full Width containers you just added to your page.

Move the mouse pointer over the new picture frame and choose the pencil symbol in the upper right corner. Browse down to the image section and choose Upload. Click the Paste to Page pushbutton. Choose the text block from the Builder elements. Drag-and-drop them under the Image Frame item.

Click the pencil symbol at the top of the text box to modify it. Press the Tool Bar Toggle tool to display the extra text design choices. Use the pencil symbol on this item to make changes to the separator item. Pick Single Border Solid under Styles. Modify the separator colour to your highlighted colour and then click on Save below.

Select the column options. We can now insert a pushbutton below the text. Click the Pad icon and dragging it under the text pad in the 1/3 area. You can use a # as a placeholder for entering the buttonsURL into an URL or if you do not have the page to which you want to use it.

Select Extra Large as the size of the buttons. Select Flat as the pushbutton group. Knob shape quadratic. Next, move down to the Text field and enter the text you want to appear on the Text field. Browse down to Gradient Top and Bottom buttons and use the main highlighted colour of your website or select the colour that you want it to have.

Pick your accent color and hover color. If you want, pick an item for your pushbutton, and then pick its place. Pull in a picture frame in the 2/3 area. From the picture frame setting, set the option. Upload your picture and click on Saving.

NOTE: Before proceeding, be sure to click the Refresh icon in the Edit Page section on the right. If you click Save, the information is only saved on a temporary basis until you click the Refresh button on the page. First, it would be great to have the background picture in the full width section of the screen as it is our picture on the first page.

The next thing to do is to have a little more room around the text blocks and picture sections so that they look more beautiful and have more distance to the wallpaper. As a result, our wallpaper in the Full Width section can really have full width. We need to create a little more room around the text and the buttons.

Press the Builder Elements pushbutton to append the Tagline Box to our new Full Width Tag.

Change the Flat setting for the badge style, Place the badge style on Squares and Change the Badge colour to Standard. You use the highlighted colour of your pages for the clarifier colour. Dragging a picture frame into the 2/3 area. You can use the Stylus utility to customize the picture frame setting. Select Drop Shadow for Frame Style.

Select for the Hover type elevator up. Click the Stylus button and select the section entitled Wallpaper to insert a wallpaper to the first and last column. Select this option to load a wallpaper. Specify a wallpaper colour that complements the wallpapers on both sides. Select a one-piece volume for the part.

Make the colour look different from the wallpaper colour by changing it to black. Select all text and use the Text Colour on Whites option. Note that this makes the text look as if it has vanished as it blends into the editor's blank screen backdrop.

Customizing the copyrighted text of the bottom line and deleting information about the creator of the topic can sometimes be very tedious. Luckily, they made it very easy with the Avada topic. Navigate to the Avada menus, and then click Topic Options. Browse down to the options for the copyrights section of the bottom line. You can show or hide your copyrights here.

The Copyright Text area lets you customize the standard text to fit the information you want to display. The Avada themes have added a standard Blogsidebaridget, which appears on your Blogsite, as well as 4 Footer widgets. However, if you only enter contents in e.g. 4 and do not enter anything in 1-3, 4 will be displayed by default only on the back of the display.

Avada Topic includes several useful Widget that we can include in our bottom line. Let's begin with the Avada: Please click on the Avada: Well, I like seeing the Avada: When you are on Twitter, you can append the Avada: In the interior of the Avada: Then we' ll just put in the Avada:

Plenty of choices. Modify the WordPress Start Page on your website. Once you have added a few pages to your website, you will probably want to include these pages in the top level of your website menus. Click on the top shortcut that says: Make a new meal.

Assign a name to the submenu, some call it the "Main Menu", and then click the Create menu tool. Let's now put some pages to our menue. Select the pages you want to include in your menus and click the Append to Menus buttons. Dragging one page under another slightly to the right will pull it in and make it a submenu or drop-down element in your currently posted menus.

Or you can click on any option and modify the name if you like. Click Save Menus below. I have given you an introductory course on creating a website with the Avada themes in this workshop. This topic gives you a great deal of versatility to build the kind of website and web pages that will make you and your business look good.

Mehr zum Thema