What are shortcodes?
Did you ever see a text within brackets in WordPress? Then you have seen a short code. Shortcodes in WordPress are:
“bits of small code that allow WordPress website users to do various things very easy. Without writing any code.”
WordPress introduced it in WordPress version 2.5. And look like this:
[Active24-shortcode].
You can enter the special tags in several places on WordPress. It replaces the content, when a web visitor views its WordPress site.
When to use shortcodes in WordPress?
WordPress has several security checks and filters built in.
To prevent malicious code to come into:
- WordPress Posts
- WordPress Pages
- WordPress Widgets
- WordPress Themes
1. Adding Shortcode in WordPress with Elementor
Getting the Shortcode
Let us suppose that you have built a Contact Form using Contact Form 7 plugin and want to display that contact form on a page built with Elementor Page Builder. In order to do that, you would first need to get the Shortcode of a particular contact form you’d like to be displayed.
It is pretty easy to get the shortcode for your contact form. For this, you need to first log into your WordPress Admin dashboard and then go to Contact > Contact Forms.
![Go to Contact Form](https://powerpackelements.com/wp-content/uploads/2021/03/screely-1616481803356-768x1024.png)
Here, you will be able to see the Shortcodes for all the Contact Forms. If you are not able to see the shortcodes, check the screen options and check if the shortcodes column is enabled or not.
![Copy the Shortcode](https://powerpackelements.com/wp-content/uploads/2021/03/screely-1616482086711-1024x493.png)
Now, simply copy the shortcode.1.
2. Embed Contact Form using Shortcode in Elementor Page Builder
As we discussed above, we want to display the contact form on a page built with Elementor.
So, let us now create and edit a new page with Elementor by heading over to WP-Admin > Pages > Add New and clicking the Edit with Elementor button.
![Edit the Page with Elementor](https://powerpackelements.com/wp-content/uploads/2021/03/screely-1610522349273-1024x680.png)
Here, we will be using the Shortcode widget of Elementor to embed the Contact Form. So, let us drag and drop the Shortcode widget to the page.
![Shortcode Widget](https://powerpackelements.com/wp-content/uploads/2021/03/screely-1616482557731.png)
Now, in the Shortcode widget, paste the Shortcode that you copied in the previous step.
![Paste the Shortcode in Shortcode Widget](https://powerpackelements.com/wp-content/uploads/2021/03/screely-1616482499933-1024x581.png)
The Contact Form will now be displayed on the page. Finally, publish the page.
3. Conclusion!
That’s it! It is this simple to add Shortcode in WordPress with Elementor Page Builder. The Shortcode widget of Elementor can display Twitter Feed, Gallery, Website API, and many other things.
Leave a reply