Install the Loudcrowd app to your store
Install the Loudcrowd app from the shopify marketplace. This will take you through setting permissions and integrating with your LoudCrowd account.
Update your store's theme
Edit a new copy of the theme and go to the App Embeds tab on the left of the editor. Make sure the Loudcrowd app is installed and turned on.
Add a New Page Template
Add a new template based on the template of your preference
Go to your store's Shopify Admin
Click on "Customize" theme button
Create a new page template named "influencer-list"
Add the "Influencer List" block to the newly created "influencer-list" template
Save your changes.
Assign a new page in the Shopify admin to that template:
Test the Influencer List page
With the LoudCrowd app enabled on your store, and the new template present on a page, you will now be able to test the page using the following link:
Style your Influencer List page
The next step is styling the page to match your brand’s aesthetic. We strive to make the blocks look great without customization, however due to the variation of environments they may be deployed to, sometimes they need a bit of styling.
In your theme's
/Assets
folder, make a file calledloudcrowd.css
In the
theme.liquid
file, add this snippet of code to the <head> component. Make sure/pages/influencer-list-page
point to your recently created page slug.<!-- LoudCrowd -->
{% if request.path contains '/pages/influencer-list-page' %}
<link rel="preload" href="{{ 'loudcrowd.css' | asset_url }}" as="style"> {{ 'loudcrowd.css' | asset_url | stylesheet_tag }}
{% endif %}Then you can begin modifying the block components in
loudcrowd.css
NOTE: This example is just a small portion of the css variables that can be set on these components. Please refer to this article about the various css settings that can be modified and overridden https://help.loudcrowd.com/en/articles/9483650-styling-influencer-list-blockinfluencer-list-block {
--lc-primary-color: #fedd00;
}