What are containers?

  • 1
  • 2
  • Question
  • Updated 1 month ago
  • Answered
By clicking Elements on the side bar, then on Containers there are some smart ways to add content to your website in a contained way. For example, if you want a box containing an image and piece of text, first add the container, then add your image and text box - this box now has the text and image anchored to it, wherever you move the box, the text and image goes to. Not only is that quite nice when editing, it is also nicer behind the scenes in the website code, when a user now views your website on a smaller screen, the background box will justify correctly and still display the image and text how you defined it to.

The second nice feature with containers in the ability to tabulate them. Again in the Elements > Container menu, select Tabs. With this container you can set up a series of different bits of content to display in the box, then you can set up how you want to transition between those different pieces of content. Providing a scenario may make its function clearer, lets assume you are wanting to display 3-4 different products you sell. Rather than displaying all of the images at once, cluttering up valuable website space you can add each image to a tab of a container. Once all 3 images have been added you can choose how you want users to move between them, to do this select the container, click Settings on the tools palette and click Tabs Transitions.

Here you are able to change the animation between each tab, how long that animation takes and if you want the animation to occur automatically, i.e. without the user having to trigger the tab change.
Photo of Homestead FAQ

Homestead FAQ, Employee

  • 39,386 Points 20k badge 2x thumb

Posted 1 year ago

  • 1
  • 2
Photo of Mary6707

Mary6707

  • 362 Points 250 badge 2x thumb
I really need to see a video example of this in action
Photo of Mary6707

Mary6707

  • 362 Points 250 badge 2x thumb
no one ever replied to my request.
Photo of Drew N

Drew N, Community Manager

  • 256,772 Points 100k badge 2x thumb
I am sorry, we don't currently have any videos available. I am going to make some topics with screen shots. I will try to make a video and see if people like it. I actually did a survery a while back and most people were not interested in videos, but there have been more requests lately.
Photo of Igor2189

Igor2189

  • 898 Points 500 badge 2x thumb
This reply was created from a merged topic originally titled In WebsiteBuilder, in the ‘Elements’ what is Containers and how does it work?.

In WebsiteBuilder, in the ‘Elements’ what is ‘Containers’ and how does it work?
I have many images which I would like to spread in to several pages instead of grouping them all on one page. Can I use the tabs in ‘Containers’ to do so?
Photo of Drew N

Drew N, Community Manager

  • 256,772 Points 100k badge 2x thumb
Unfortunately, each container is a separate element. They can't be connected to each other. You could create the containers and then make links from buttons to each page.
Photo of Igor2189

Igor2189

  • 898 Points 500 badge 2x thumb
Ok.    But is it possible in Websitebuilder to make a "1,2,3,4,5..." transition between different pages, like they have in Ebay, Amazon, as well as all the common websites?
Photo of Drew N

Drew N, Community Manager

  • 256,772 Points 100k badge 2x thumb
Not between pages. But you can emulate it by placing text boxes with numbers and linking each one to the appropriate page. Our ecommerce program will create those pages and links automatically if too many products are on a page, but since the elements are not connected, the system can't be told to create automatic links.
Photo of Igor2189

Igor2189

  • 898 Points 500 badge 2x thumb
In that case, is it to my advantage to use Containers at all for what I need? I tried to put 15 images in a container and for some reason they look scrambled in the Mobile view. Also, how to place a title under each image, so it will stay under the image in the Mobile view?
Photo of Drew N

Drew N, Community Manager

  • 256,772 Points 100k badge 2x thumb
I could see how 15 might be an issue for the mobile view. It does have to fit them into a small area. As for the title, it also might be reorganized, but you should be able to change the position of elements by drag and drop. Do you have an example on there now? What page? I can look and see if I can think of anything else.