[fusion_builder_container hundred_percent=”no” equal_height_columns=”no” menu_anchor=”” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” background_color=”” background_image=”” background_position=”center center” background_repeat=”no-repeat” fade=”no” background_parallax=”none” parallax_speed=”0.3″ video_mp4=”” video_webm=”” video_ogv=”” video_url=”” video_aspect_ratio=”16:9″ video_loop=”yes” video_mute=”yes” overlay_color=”” video_preview_image=”” border_size=”” border_color=”” border_style=”solid” padding_top=”” padding_bottom=”” padding_left=”” padding_right=””][fusion_builder_row][fusion_builder_column type=”1_1″ layout=”1_1″ background_position=”left top” background_color=”” border_size=”” border_color=”” border_style=”solid” border_position=”all” spacing=”yes” background_image=”” background_repeat=”no-repeat” padding=”” margin_top=”0px” margin_bottom=”0px” class=”” id=”” animation_type=”” animation_speed=”0.3″ animation_direction=”left” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” center_content=”no” last=”no” min_height=”” hover_type=”none” link=””][fusion_text]
The Avada theme for WordPress is the most popular theme on ThemeForest. It’s a powerful and easy to use theme. One of the features that’s included is Fusion Builder. This makes it incredibly easy to build pages. With a little practice, one can easily build and customize web pages without needing to know any HTML or CSS. However, in some cases, we need to add data to existing pages in a way that is not yet easily done with the built-in tools that Avada’s Fusion Builder offers. For instance, with Avada’s Fusion Builder, we can easily add a Table to any webpage. However, the table that is added only includes one row of data. In this tutorial, we’ll learn how to add more rows of data to the table.
Add a Table with Avada Fusion Builder
- First, go to the page that you want to edit (Pages > All Pages).
- Then, click on the + Element button where you want to add the new table.
[fusion_imageframe image_id=”721″ style_type=”dropshadow” stylecolor=”” hover_type=”none” bordersize=”1″ bordercolor=”” borderradius=”” align=”none” lightbox=”no” gallery_id=”” lightbox_image=”” alt=”” link=”” linktarget=”_self” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” animation_type=”fade” animation_direction=”left” animation_speed=”1.0″ animation_offset=””]https://alexestrada.com/wp-content/uploads/2015/09/1-add-table-element.png[/fusion_imageframe]
[fusion_separator style_type=”none” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” sep_color=”” top_margin=”” bottom_margin=”15px” border_size=”” icon=”” icon_circle=”” icon_circle_color=”” width=”” alignment=”center”][/fusion_separator] - Select the Table button to add a new table.
[fusion_imageframe image_id=”722″ style_type=”dropshadow” stylecolor=”” hover_type=”none” bordersize=”1″ bordercolor=”” borderradius=”” align=”none” lightbox=”no” gallery_id=”” lightbox_image=”” alt=”” link=”” linktarget=”_self” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” animation_type=”” animation_direction=”left” animation_speed=”0.3″ animation_offset=””]https://alexestrada.com/wp-content/uploads/2015/09/2-select-table-element.png[/fusion_imageframe]
[fusion_separator style_type=”none” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” sep_color=”” top_margin=”” bottom_margin=”15px” border_size=”” icon=”” icon_circle=”” icon_circle_color=”” width=”” alignment=”center”][/fusion_separator] - Select the table Type (i.e. Style) and the Number of Columns, then click Save.
[fusion_imageframe image_id=”723″ style_type=”dropshadow” stylecolor=”” hover_type=”none” bordersize=”1″ bordercolor=”” borderradius=”” align=”none” lightbox=”no” gallery_id=”” lightbox_image=”” alt=”” link=”” linktarget=”_self” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” animation_type=”” animation_direction=”left” animation_speed=”0.3″ animation_offset=””]https://alexestrada.com/wp-content/uploads/2015/09/3-create-avada-table.png[/fusion_imageframe]
Edit the Table
- Hover over the Table element.
[fusion_imageframe image_id=”730″ style_type=”dropshadow” stylecolor=”” hover_type=”none” bordersize=”1″ bordercolor=”” borderradius=”” align=”none” lightbox=”no” gallery_id=”” lightbox_image=”” alt=”” link=”” linktarget=”_self” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” animation_type=”” animation_direction=”left” animation_speed=”0.3″ animation_offset=””]https://alexestrada.com/wp-content/uploads/2015/09/1.png[/fusion_imageframe]
[fusion_separator style_type=”none” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” sep_color=”” top_margin=”” bottom_margin=”15px” border_size=”” icon=”” icon_circle=”” icon_circle_color=”” width=”” alignment=”center”][/fusion_separator] - Select the Edit icon for the Table.
[fusion_imageframe image_id=”731″ style_type=”dropshadow” stylecolor=”” hover_type=”none” bordersize=”1″ bordercolor=”” borderradius=”” align=”none” lightbox=”no” gallery_id=”” lightbox_image=”” alt=”” link=”” linktarget=”_self” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” animation_type=”” animation_direction=”left” animation_speed=”0.3″ animation_offset=””]https://alexestrada.com/wp-content/uploads/2015/09/2.png[/fusion_imageframe]
[fusion_separator style_type=”none” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” sep_color=”” top_margin=”” bottom_margin=”15px” border_size=”” icon=”” icon_circle=”” icon_circle_color=”” width=”” alignment=”center”][/fusion_separator] - Select the Text tab in the editor.
[fusion_imageframe image_id=”729″ style_type=”dropshadow” stylecolor=”” hover_type=”none” bordersize=”1″ bordercolor=”” borderradius=”” align=”none” lightbox=”no” gallery_id=”” lightbox_image=”” alt=”” link=”” linktarget=”_self” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” animation_type=”” animation_direction=”left” animation_speed=”0.3″ animation_offset=””]https://alexestrada.com/wp-content/uploads/2015/09/3.png[/fusion_imageframe]
[fusion_separator style_type=”none” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” sep_color=”” top_margin=”” bottom_margin=”15px” border_size=”” icon=”” icon_circle=”” icon_circle_color=”” width=”” alignment=”center”][/fusion_separator] - TIP: Lets back up the existing code. Highlight all of the text in the text area, Copy it. Paste the code in a separate file, preferably Notepad (windows) or TextEdit (Mac).
[fusion_imageframe image_id=”732″ style_type=”dropshadow” stylecolor=”” hover_type=”none” bordersize=”1″ bordercolor=”” borderradius=”” align=”none” lightbox=”no” gallery_id=”” lightbox_image=”” alt=”” link=”” linktarget=”_self” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” animation_type=”” animation_direction=”left” animation_speed=”0.3″ animation_offset=””]https://alexestrada.com/wp-content/uploads/2015/09/4.png[/fusion_imageframe]
[fusion_separator style_type=”none” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” sep_color=”” top_margin=”” bottom_margin=”15px” border_size=”” icon=”” icon_circle=”” icon_circle_color=”” width=”” alignment=”center”][/fusion_separator] - Highlight, and Copy a Table Row.
[fusion_imageframe image_id=”733″ style_type=”dropshadow” stylecolor=”” hover_type=”none” bordersize=”1″ bordercolor=”” borderradius=”” align=”none” lightbox=”no” gallery_id=”” lightbox_image=”” alt=”” link=”” linktarget=”_self” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” animation_type=”” animation_direction=”left” animation_speed=”0.3″ animation_offset=””]https://alexestrada.com/wp-content/uploads/2015/09/5.png[/fusion_imageframe]
[fusion_separator style_type=”none” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” sep_color=”” top_margin=”” bottom_margin=”15px” border_size=”” icon=”” icon_circle=”” icon_circle_color=”” width=”” alignment=”center”][/fusion_separator] - Paste the new Table Row in the appropriate spot and change the information.
[fusion_imageframe image_id=”739″ style_type=”dropshadow” stylecolor=”” hover_type=”none” bordersize=”1″ bordercolor=”” borderradius=”” align=”none” lightbox=”no” gallery_id=”” lightbox_image=”” alt=”” link=”” linktarget=”_self” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” animation_type=”” animation_direction=”left” animation_speed=”0.3″ animation_offset=””]https://alexestrada.com/wp-content/uploads/2015/09/6-1.png[/fusion_imageframe]
[fusion_separator style_type=”none” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” sep_color=”” top_margin=”” bottom_margin=”15px” border_size=”” icon=”” icon_circle=”” icon_circle_color=”” width=”” alignment=”center”][/fusion_separator] - Save the HTML, then Update the page and refresh the webpage to view your changes.
[fusion_separator style_type=”none” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” sep_color=”” top_margin=”” bottom_margin=”5px” border_size=”” icon=”” icon_circle=”” icon_circle_color=”” width=”” alignment=”center”][/fusion_separator]
[fusion_imageframe image_id=”735″ style_type=”dropshadow” stylecolor=”” hover_type=”none” bordersize=”1″ bordercolor=”” borderradius=”” align=”none” lightbox=”no” gallery_id=”” lightbox_image=”” alt=”” link=”” linktarget=”_self” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” animation_type=”” animation_direction=”left” animation_speed=”0.3″ animation_offset=””]https://alexestrada.com/wp-content/uploads/2015/09/11.png[/fusion_imageframe]
[fusion_separator style_type=”none” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” sep_color=”” top_margin=”” bottom_margin=”10px” border_size=”” icon=”” icon_circle=”” icon_circle_color=”” width=”” alignment=”center”][/fusion_separator]
Don’t forget to Update the page!
[fusion_separator style_type=”none” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” sep_color=”” top_margin=”” bottom_margin=”1px” border_size=”” icon=”” icon_circle=”” icon_circle_color=”” width=”” alignment=”center”][/fusion_separator]
[fusion_imageframe image_id=”736″ style_type=”dropshadow” stylecolor=”” hover_type=”none” bordersize=”1″ bordercolor=”” borderradius=”” align=”none” lightbox=”no” gallery_id=”” lightbox_image=”” alt=”” link=”” linktarget=”_self” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” animation_type=”” animation_direction=”left” animation_speed=”0.3″ animation_offset=””]https://alexestrada.com/wp-content/uploads/2015/09/12.png[/fusion_imageframe]
[fusion_separator style_type=”none” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” sep_color=”” top_margin=”” bottom_margin=”15px” border_size=”” icon=”” icon_circle=”” icon_circle_color=”” width=”” alignment=”center”][/fusion_separator] - Click on the Fusion Builder button to go back to the Fusion Builder editor.
[/fusion_text][/fusion_builder_column][/fusion_builder_row][/fusion_builder_container]