how to replace wordpress plugins and shortcodes in jekyll

What happens to WordPress plugins and shortcodes after migration?

When you move from WordPress to Jekyll, you leave behind the rich plugin ecosystem and dynamic shortcode processing. WordPress sites often rely on these tools for SEO, galleries, forms, embeds, social sharing, and more. Without a dynamic engine like PHP, Jekyll handles these differently—or not at all out of the box.

This article explains how to replace key WordPress plugins and shortcodes with Jekyll-native alternatives, so your site remains fully functional and optimized even in a static environment.

Why do WordPress shortcodes break in Jekyll?

WordPress shortcodes are PHP-based syntax wrappers that insert dynamic content using brackets like [gallery] or [contact-form]. Jekyll, being a static site generator, doesn’t parse this format. Unless manually converted or replaced, these tags will appear as raw text.

The solution is to use Liquid includes and Markdown extensions to simulate similar behavior.

How can you replace WordPress shortcodes with Jekyll includes?

Let’s say your WordPress site uses a shortcode like:

[button link="https://example.com"]Click Here[/button]

You can replace this with a custom Jekyll include:

{% include button.html link="https://example.com" text="Click Here" %}

Then create a file called _includes/button.html:

<a href="{{ include.link }}" class="btn btn-primary">{{ include.text }}</a>

This lets you reuse buttons throughout the site in a clean, readable format.

What are common WordPress shortcodes and their Jekyll replacements?

WordPress Shortcode	Jekyll Replacement
[gallery ids="1,2,3"]	Use _data/gallery.yml + include gallery.html
[contact-form-7]	Use Formspree, Netlify Forms, or Formsubmit.io
[embed]	Use native Markdown or Liquid YouTube/Vimeo embed snippets
[recent-posts]	Use Liquid loops: {% for post in site.posts limit:5 %}

What about plugins for SEO, analytics, and sitemap generation?

WordPress plugins like Yoast SEO or Rank Math are incredibly powerful. While Jekyll doesn’t support these natively, the same results can be achieved through configuration, includes, and third-party integrations.

How to handle SEO in Jekyll?

• Title & description: Use YAML front matter per post, then render with a shared SEO include.
• Open Graph: Add dynamic meta tags in _includes/seo.html.
• Sitemap: Use the jekyll-sitemap plugin or generate manually.
• Canonical URLs: Define the base URL in _config.yml and insert via meta tags.

<meta property="og:title" content="{{ page.title }}" />
<meta name="description" content="{{ page.description | default: site.description }}" />

How to add Google Analytics?

Insert your GA tracking script inside _includes/head.html:

<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXX-Y"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXXXX-Y');
</script>

Or use Google Tag Manager for more flexibility.

How do you replace a plugin like Jetpack?

Jetpack bundles many features. Here’s how you can replicate them:

• Lazy loading images: Use native loading="lazy" attribute
• Social sharing: Use AddThis or share buttons via includes
• Related posts: Build a tag-based related posts list with Liquid
• Markdown support: Native in Jekyll

How to migrate dynamic forms and comments?

Forms

In WordPress, Contact Form 7 or WPForms powers user submissions. In Jekyll, you need to use external services:

• Formspree: Easy integration, free tier
• Netlify Forms: Requires Netlify hosting but supports spam protection
• Formsubmit.io: No backend required

Example:

<form action="https://formspree.io/f/yourcode" method="POST">
  <input type="email" name="email" required>
  <textarea name="message"></textarea>
  <button type="submit">Send</button>
</form>

Comments

Jekyll doesn’t support native commenting. Use:

• Disqus: Most popular, but ads may appear
• Giscus: Uses GitHub Discussions, ideal for dev blogs
• Utterances: GitHub-based, minimal and privacy-friendly

Add Giscus with a script in your post layout:

<script src="https://giscus.app/client.js"
        data-repo="yourusername/yourrepo"
        data-repo-id="..."
        data-category="..."
        data-mapping="pathname"
        crossorigin="anonymous"
        async>
</script>

What’s the best way to track plugin usage before migration?

Before migrating, use a plugin like "Plugin Organizer" or "Plugin Detective" to audit what each plugin does. List what must be replaced and what can be discarded.

Create a spreadsheet with three columns:

• WordPress Plugin
• What it does
• How to replicate in Jekyll

This will give clarity to the scope of post-migration work.

How to handle redirects from plugin-based URLs?

If plugins created custom post types or URLs like /events/my-conference, preserve SEO with redirects using _redirects file (Netlify) or redirect_from plugin in Jekyll.

redirect_from:
  - /old-url/

Or manually create redirect headers in your server or CDN.

Conclusion

While migrating from WordPress to Jekyll removes plugin dependency, it also requires careful mapping and creative replacement of essential features. From shortcodes to contact forms, most functionalities can be recreated using Liquid, includes, and external services. Though not as plug-and-play as WordPress, the final result is faster, safer, and more transparent.

With planning and the right Jekyll tooling, you can achieve a site that feels just as capable as its dynamic predecessor—only simpler, faster, and fully version-controlled.