This is an example of how to use Plasmic with custom targeting. Following the code in Docs.
- In plasmic-host it's defined the custom targetting traits
utm_source
andbrowser
; - In middleware both the values of
utm_source
andbrowser
are passed togetMiddlewareResponse
as well as some special handling to onlygetMiddlewareResponse
if the page is a splits enabled page; - In Catch All the
rewriteWithoutTraits
function is called to extract the traits from the url, ingetStaticPaths
the functiongenerateAllPaths
is called so that all seeded pages are generated in build time. The page usesPlasmicSplitsProvider
to provide the traits to power A/B testing, segmentation and scheduling.
To open the corresponding Plasmic project (cloning it if you wish):
https://studio.plasmic.app/projects/pKnDSUf6hHdKMbSuzompSH
A live demo is available at:
https://custom-targeting-codegen.vercel.app/
The targetting shows different variations based on the following rules:
browser
=chrome
utm_source
=google
By going to the following URL:
https://custom-targeting-codegen.vercel.app/?utm_source=google
The variation with utm_source = google will be shown. By using different browsers, the variation with browser = chrome will be shown.
In the abtest page, it's possible to see the different variations by clicking in the main button:
https://custom-targeting-codegen.vercel.app/abtest
With Plasmic, you can enable non-developers on your team to publish pages and content into your website or app.
To learn more about Plasmic, take a look at the following resources:
You can check out the Plasmic GitHub repository - your feedback and contributions are welcome!