Need a way to create and manage subscriptions for individuals and groups? With Pico, you can manage free and premium content subscriptions. All you need is a little HTML and CSS, but don't worry—we provide the code for you so all you have to know is how to copy and paste.

Within WordPress, head to the plugins panel and search for Pico. Install and activate this plugin. In Pico, under Settings → Integrations, connect your Stripe account. Then grab the ID and API for WordPress and paste those into the WordPress Pico Plugin. If you did not sign up with Pico with a domain, you will need to have a URL in the Primary URL field of your settings. In this example, the domain should be the WordPress domain.

Next, within Pico, under Settings → Newsletters add your Free and Premium newsletters. Then head to the IAM tab and create a Registration Rule. First, select your audience under the Exposure tab. Then head to the Access tab. Here is where you can set how people subscribe to your content, either by email, Facebook, and/or Google, and which content they can register for.

In WordPress, create a Subscribe button and select 'Edit as HTML' on that element. From the Registration Rule, under Popup, copy the PicoRule class and paste it into your button after wp-block-button. Then we are going to add a PicoSignal which will tell the element when to show and when not to be shown. We want registered users to see an option to Go Premium after they have registered so we are going to add a HideWhenRegistered class to our button. Your button's HTML should look like this:

‍

Add another button element to your WordPress page and label this one 'Go Premium' or something similar to indicate a user can upgrade. Head back into Pico, and this time under Monetization Plans, click '+ Add plan'. Select 'Individual Subscription' and click 'Get started.'

Select your Audience and then head to the Offer tab. Here is where you can set tiers. Let's create a Premium tier and set the price. Select your Premium newsletter under 'Require a subscription to this tier for access to the following newsletters'. From the Popup tab, copy the class PicoPlan. Save your plan and then head back to WordPress. Paste this class into your 'Go Premium' button.

We also want to set a PicoSignal here to show when a user is registered. The HTML for your button should look like this:

‍

Now, in WordPress, go to your Dashboard and select Appearance → Customize → Additional CSS. Paste in the following CSS:

.PicoSignal[data-pico-status=registered],PicoSignal[data-pico-status=paying]{display: none !important;}.ShowWhenRegistered {display:none !important;}.ShowWhenRegistered[data-pico-status="registered"],.ShowWhenRegistered[data-pico-status="paying"] {display:block !important;}

‍

Click Publish. Now go to your page, preview it in a new tab, and test it out. Special thanks to Caleb at Pico and Aleks Basara for providing the low-code support for this tutorial.