Adding CrowdFunding campaigns to your PrestaShop website

Adding Crowdfunding capabilities to your PrestaShop website
Adding Crowdfunding capabilities to your PrestaShop website

Are you creating your website using PrestaShop? Would you like to add Crowdfunding capabilities, and campaigns to your website? This tutorial will show you how you can quickly add a fully white labeled Crowdfunding campaign to your new or existing PrestaShop website.

This article is part of the blog series for adding Crowdfunding features on your website. You can learn about adding Crowdfunding capabilities on other platforms such as Shopify, Squarespace, Wix, BigCommerce, Boldgrid, Duda, UcraftPagecloud, Site123, Weeblyand GoDaddy as included in this series.

The solution described in this blog article can be used for any rewards/pre-order, or donations based Crowdfunding campaigns and paradigms. It is great for running a single campaign, or multiple campaigns on separate pages for any new or existing PrestaShop website using white label technology such as Atlas. To gain the capabilities to run a fully white labeled Crowdfunding campaign on your PrestaShop website, you need to subscribe to an Atlas subscription plan. The Micro subscription plan is great to use for this purpose. Included in the subscription plans is the Sedra widget. You can use the Sedra widget to host a campaign on any web page.

Please note that it is recommended to read the following article to quickly set up the widget for this tutorial.

Creating a Crowdfunding campaign page on your PrestaShop site

Step 1: Subscribe to the Atlas subscription plan.

New Atlas Subscription plans Thrinacia UI
Atlas subscription plan options

Step 2: Create the Crowdfunding campaign, and copy the widget code.

Campaign creation steps preview widget code
Campaign creation steps preview widget code

Step 3: Host the widget on a separate page.

Once you have created the campaign and copied the widget code, you will have to host the widget on a separate page. You will have to reference this page in order to host it on the PrestaShop website. If you would like to host the campaign on a separate page using the Atlas platform, you can log into the site using SFTP, create a new .html file with the widget code included for this example we have saved it to be called widget.html:

Widget code pasted into editor
Widget code pasted into editor

Import the .html file that you created as a new page via SFTP. Place the file in the following location using SFTP: webui/angapp/widget.html

Go to the page that is hosting the widget, and copy the URL.

Step 4: Log into the PrestaShop website, create a new page, and paste the URL which is hosting the widget on to the new page and view the campaign.

Go to the dashboard, in the left menu, click on Design, then on the Pages option:

Pages option in the design dropdown menu
Pages option in the design dropdown menu

Click on Add new page.

Add new page
Add new page

Fill in the required fields, then click on the code view with the symbol “<>

Click on the code view symbol "<>"
Click on the code view symbol “<>”

In order to display the campaign on the page, you will have to use an Iframe link that is refrencing the widget page that was created in the previous step. Below is an example of the link that you should use:

<iframe width=”100%” height=”500px” src=”YOUR-URL-HERE” frameborder=”0″></iframe>

 

Example of iframe
Example of iframe

As you can see from the above image, once you save, the iframe will be wrapped in a paragraph tag. This is fine. Make sure you save the page.

You can now view, and donate to the campaign.

 

View and donate to the campaign
View and donate to the campaign

That is how you can add any pre-orderrewards, and donations based Crowdfunding campaign on to your PrestaShop website. For a full and more detailed tutorial, you can watch the following video: