How to setup auction page using Elementor

What is Elementor?

Elementor is a Website Builder plugin that comes with an exclusive toolset, which lets you create a truly responsive website in a whole new and visual way. From different font sizes, padding, and margin per device, to reverse column ordering, this is the most powerful site builder for creating perfect responsive websites.

Find out more about Elementor from its official site.

Install Elementor plugin:

To use the Elementor plugin on your website first you need to install the Elementor plugin from the Install plugin section. You can either download the Elementor plugin from here or you can navigate to Plugins > Add New and search Elementor.

Activate the plugin after installation and visit the Elementor > Getting Started guide for more information. Click on Create Your First Page to create a new page on your site.

Create Elementor page:

Elementor is a drag-and-drop page builder which can work with any WordPress theme. You don't need to learn HTML and CSS to build your pages. You can use Elementor without any coding skills. It has a user-friendly interface to create pages and posts and many other features.

Let's create a new Elementor page. In order to do it, Navigates to your WordPress dashboard and click on Pages and click the Add New button.

Add your page title and select the Elementor Canvas template from the template dropdown at the Page Attributes section.

On top, you will find the Edit with Elementor button. Click on it and you will redirect the Elementor page builder. From there you can do many customizations.

Setting the Auction page:

We need to add an Auction shortcode to display our auction product on the Cars Auction Page. We need a Shortcode Widget of Elementor to work with shortcodes. For that write a shortcode on the search bar of the Elements section and you will find Shortcode Widget in the search result.

Drag and drop the Shortcode widget to the Drag Widget here area of your page like the below image.

You can add columns or other types of widgets as per your need but for now, I am going to make it simple to understand. We need a shortcode to display auction products on any page we want. we will use [uwa_new_auctions] shortcode to display auction products.

Write down the [uwa_new_auctions] in the "Enter your shortcode" text area of the shortcode widget. you can read more about how to show auctions on your website from this article.

It will show changes as per your shortcode on the right side. If you want then you can add more in the shortcode like...

[uwa_new_auctions days_when_added=”10″ columns=”4″ orderby=”date” order=”desc/asc” show_expired=”yes/no”]

Now we have a list of products on the Cars Auction page and if you don't know how to create an auction product manually then refer to this article.

Sometimes you may have category-wise products. If that's the case then you can add [products category="category_name_here"] shortcode and it will display products category wise. (i.e: [products category="cars-auction"])

Click on the preview icon to preview your page before publishing it.

For more information about the auction product's shortcode then refer to this article.

Publish the Auction page:

Now it's time to publish our newly created page. Click on Save/Update button to save the changes. Visit your newly created page and it will look something like the below image.

Setup Single Product Page:

If the admin would like to set up a single-product page using the Elementor plugin, please review the documentation below.
https://elementor.com/help/single-product-site-part/

When the admin set up a product page using the Elementor plugin, there is no widget available for the bid section in the Elementor plugin. The admin needs to add an "Add To Cart" widget to display the product condition, timer, and bid section on the single-product page.