Elementor is a leading website builder which allows WordPress users to create and edit websites. They are well-known for their drag&drop technique and a built-in responsive mode.
Learn how to embed a Walls.io social wall in a few simple steps
1. Sign up at Walls.io & set up your social wall
To get started, sign up for a Walls.io trial and create a new wall.
Setting up your social wall is fairly easy - just add content sources and personalised posts, choose your moderation mode and have some fun with the wall design.
For more detailed instructions, check out our tutorial or watch the video below!
2. Copy the JavaScript or Iframe embed code from your wall
In your Walls.io account, go to "Embed & Display" and copy the JavaScript or Iframe embed code (it's enough to click on the code to copy it to your clipboard):
For most use cases, we recommend sticking with our "Fluid" default layout. In case another one suits you better, or you want to change a colour scheme or language, make sure to check the advanced settings before you copy the embed code:
Our interface is beginner-friendly, and most options are self-explanatory; still, we have more information on how to embed the Walls.io widget here.
3. Insert your social wall in the Elementor editor
First off, select the page where you want to add your wall and click "Edit with Elementor":
Then, drag and drop the HTML widget on to your page. You can find it under the "Elements" menu using “HTML” as a keyword:
Finally, position the new element to the place you want it to appear on your page and paste the embed code from step 2 into the HTML Code element:
You can top it off with some customizations:
Done!
That's all there is! You can now publish the page and check it to see if everything is up to your expectations!
More tips & tricks:
The Walls.io widget is fully responsive – which means it will automatically adapt to the size of the section you are embedding it to. You can override this by setting fixed width, height, rows, and columns when generating the embed code (we recommend using the default for maximum layout compatibility).
Try out our different layouts! Walls.io offers a variety of diverse layouts to display your wall. Continue to read here for more details!
In case you have further questions, don't hesitate to contact the support team via chat or support@walls.io!