Are you tired of the endless struggle of choosing a website layout design? Do you find yourself spending hours trying to make your site look professional and visually appealing, only to end up frustrated with the results? Trust me, I’ve been there too. As someone who is just starting out in the world of web design, it can be overwhelming to navigate through the complexities of creating a visually stunning and user-friendly website.
But that’s not all. Are you also looking to seamlessly integrate your Shopify products into your WordPress site? Well, look no further because I have the perfect solution for you. Introducing ShopWP Shopify Layout Builder, your ultimate website design companion. As someone who has always been passionate about creating stunning websites, I understand the challenges that come with finding the right tools to bring your vision to life. ShopWP Layout Builder has you covered. Imagine having the ability to showcase and sell your Shopify products effortlessly on your WordPress website, all while maintaining a cohesive and visually appealing design.
Let me show you how this incredible tool can improve your web design experience.
What is ShopWP Layout Builder?
ShopWP Shopify Layout Builder is a WordPress plugin tailored to integrate Shopify products into your WordPress website. With this plugin, users can create stunning and professional-looking websites to sell Shopify products on WordPress without the need to be expert in coding or design skills. With ShopWP Layout Builder, you can easily build and customize your website’s layout, design, and content using a simple drag-and-drop interface.
ShopWP Pro Pricing
ShopWP Pro offers two subscription plans tailored to meet different business needs – Solo and Agency.
The Solo plan, priced at $199 per year, is ideal for individuals and companies managing a small number of WordPress sites, providing them access to key ShopWP Pro features.
For those with multiple clients or larger teams, the Agency plan at $499 per year is the go-to option. This plan not only includes all the benefits of the Solo plan but also allows for installation on an unlimited number of WordPress sites and grants access to additional plugin extensions.
Furthermore, ShopWP requires users to have an active Shopify plan, with the recommended option being the cost-effective Shopify Starter plan, making it an excellent choice for those focused solely on WordPress-based selling. You also get a 30-day refund policy.
How to Get Started with ShopWP Shopify Layout Builder
To get started with ShopWP Shopify Layout Builder, you will first need ShopWP Pro 8.0
or greater.
Once you have purchased one of the two pro versions, follow these steps:
1. Connect WordPress to Shopify
To start, you will need to install the ShopWP plugin on your WordPress site.
Once installed, you can connect WordPress to Shopify by navigating to ShopWP → Connect and clicking the button.
Provide your Shopify store URL when prompted.
If you haven’t already, you will be asked to install the ShopWP app on your Shopify store.
Once completed, you will be redirected to the plugin’s settings with a confirmation that your store has been successfully connected.
From there, you can customize your store listing pages and choose whether to link products to Shopify or display them on your WordPress site.
Additionally, you have the option to show a fixed cart tab and customize how the checkout page opens.
2. Sync Shopify Products To WordPress
After connecting your store, the next step is to synchronize your Shopify products with WordPress. You have the option to sync all of your products or select specific ones to add to WordPress.
ShopWP offers two syncing options:
- One-time Sync: You can manually sync product details whenever necessary.
- Auto Sync: ShopWP will automatically sync product details based on an interval that you control. For instance, if you make changes to a product in Shopify, those modifications will be automatically synced to WordPress without any manual effort.
To access these options, navigate to ShopWP > Sync.
To control the sync settings, go to ShopWP > Settings > Syncing.
Here, you can choose the products to sync and the amount of product information to include. Once the sync is complete, you can view the synced products under ShopWP > Products.
To use the ShopWP Layout Builder, you need to connect your Shopify store and have at least one product synced before you can use it.
Although one product is sufficient, having multiple products can make the process easier.
3. Create Layouts with Layout Builder
Head to the Layout Builder to create visually appealing product layouts without the need for manual shortcode creation.
Two types of layout types come pre-built – Product Detail Page (PDP) and Product Listing Page (PLP).
To design your own layout, go to ‘Add New.’ You can change the Layout Type from the sidebar.
When you click on ‘Add New,’ you will all of your synced products. The block settings on the right sidebar offer a wide range of editing options allowing you to edit your products’ layout design on WordPress.
The block settings you provided is an interface for customizing the display of Shopify products on a website. Here’s a summary of the editing features available:
Filtering:
- Filter by Title: Allows you to specify one or more product titles to include in the display.
- Filter by Collection: Filters products based on the collection they belong to.
- Filter by Tag: Matches products based on their tags.
- Filter by Vendor: Matches products based on their vendor.
- Filter by Product Type: Matches products based on their type.
- Available for Sale: Allows you to choose whether to show products that are in stock, out of stock, or any.
- Match Criteria: Specifies whether all filters must be true (AND) or if any will suffice (OR).
Sorting:
- Sort By: Allows you to sort products by Title, Price, or other criteria.
- Reverse Order: Lets you choose whether to display products in ascending or descending order.
Title Options:
- Product Title Font Size: Sets the font size for product titles.
- Title Color: Specifies the color of product titles.
Description Options:
- Product Description Font Size: Sets the font size for product descriptions.
- Description Color: Specifies the color of product descriptions.
- Description Line Height: Sets the line height for product descriptions.
- Limit Description Length: Allows you to limit the number of characters in the product description.
Pricing Options:
- Show Price Range: Determines whether to display a price range for products.
- Show Compare at Pricing: Shows the ‘compare at’ price if available.
- Show Price Next to Variant Button: Displays the price next to the variant selection button.
- Pricing Font Size: Sets the font size for pricing.
- Price Color: Specifies the color of the pricing.
Some latest update of the ShopWP Layout Builder includes the following changes:
- Customizable dropdown menu colors for product variants and sorting.
- Reduced JavaScript bundle size by over 100kb, resulting in a faster store and potentially increased sales.
- Added the option to sort products in the ShopWP Products block based on the “collection default” value used in Shopify.
Once you have edited and finalized the layout, copy the shortcode available at the top right corner.
4. Publish Products on WordPress
Create a new Page or Post on WordPress and paste the shortcode of the Layout you want to publish.
Once you publish the page, the layout you designed will be visible and users can directly purchase products from WordPress without going to your Shopify store.
Conclusion: Elevate Your Website Design
Having personally experienced the challenges of navigating the crowded space of Shopify plugins, I can confidently attest to the easy-to-use ShopWP Layout Builder. This innovative tool offers an easy-to-use drag-and-drop interface with automated shortcodes that simplifies the entire website creation process. One of the standout features that I found immensely helpful is the robust shortcode feature. It allowed me to add dynamic and interactive elements while designing the layout and showcasing Shopify products on WordPress. This level of flexibility opens up a world of possibilities for customization and creativity, ensuring that your website stands out in the crowded digital landscape.
FAQs
Yes, ShopWP Layout Builder is well-suited for beginners. It offers an drag-and-drop interface, making it available even to those without WordPress experience. The user-friendly design allows beginners to create visually appealing layouts for their Shopify store without a steep learning curve.
Yes, ShopWP provides customer support to assist users with any issues they may run into. They have a private Slack channel for ShopWP Pro customers only and the team is online M-F 9am-4pm CST to help solve any issues. ShopWP users who don’t have a pro version can send an email at [email protected] for their queries.
No, there are no extra costs associated with using ShopWP Layout Builder. Once you purchase the plugin, you will have access to all its features without any hidden charges. You can create as many websites as you want and use the plugin on multiple domains without any extra fees.