Posts

Showing posts with the label iska

setup multilingual blog in jekyll

By -

Why Use Jekyll for Landing Pages

Jekyll’s static nature makes it a powerful tool for building SEO-optimized landing pages. Without dynamic scripts slowing things down, you can build high-converting, lightning-fast pages tailored for specific keywords or campaigns. When combined with proper metadata and structural design, your landing pages can outperform larger CMS-based pages in search rankings and user experience.

Planning Your Landing Page Content

Before writing code, outline your landing page strategy. Ask:

  • What is the main keyword and search intent?
  • What action do you want visitors to take?
  • What problem are you solving, and how?

This helps shape your headlines, structure, and call-to-actions (CTAs) accordingly.

Step 1: Use a Custom Layout

Create a minimal layout like landing.html in the _layouts folder to remove navigation and distractions. Here’s an example layout:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>{{ page.title }}</title>
  <meta name="description" content="{{ page.description }}">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="/assets/css/landing.css">
</head>
<body>
  {{ content }}
</body>
</html>

Step 2: Create a Landing Page Markdown File

Inside your pages or root directory, create a new file like offer.md with front matter targeting the custom layout:

---
layout: landing
title: "Premium SEO Services"
description: "Get higher rankings with our proven SEO strategies designed for small businesses."
permalink: /seo-services/
---

Then continue with HTML-formatted content below the front matter. Keep it focused, persuasive, and structured.

Step 3: Optimize Headings and Content Structure

Structure your content with heading levels for easy readability:

Why Choose Our SEO Services


We help small websites compete and rank on Google using proven strategies.



What You’ll Get


    
  
  • Keyword research tailored to your niche
    • 
  
  • On-page optimization and content audit
    • 
  
  • Backlink strategy with zero spam
    • 




Client Results


We helped a local electrician grow traffic by 300% within 4 months without ads.

Step 4: Add Schema Markup

Add JSON-LD structured data to improve how search engines understand your page:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Service",
  "name": "Premium SEO Services",
  "description": "Get higher rankings with our proven SEO strategies for small business owners.",
  "provider": {
    "@type": "Organization",
    "name": "YourSiteName"
  }
}
</script>

Step 5: Add a Clear CTA

Every landing page needs a goal. Use a prominent button or form:

Request Your Free SEO Audit

Or embed a simple form (via Netlify Forms, Formspree, etc) that doesn’t require a backend.

Step 6: Track with Lightweight Analytics

Add tracking for conversions with tools like Plausible or Fathom if you prefer privacy-focused analytics, or stick with Google Analytics for more detailed funnel tracking. Ensure it loads asynchronously.

Step 7: Test and Monitor SEO Performance

  • Use Google Search Console to monitor impressions and rankings.
  • Run Lighthouse audits to check performance and SEO metrics.
  • Compress all images and inline critical CSS for optimal speed.

Conclusion

Jekyll is not just a blogging tool. When used right, it can become a lean, high-converting landing page machine. With complete control over layout, content, and SEO settings, you can outperform bloated CMS pages by focusing on speed, clarity, and intent-matching content. The next time you want to launch a product, offer a freebie, or test an idea, try building your landing page in Jekyll—it’s surprisingly effective.

Read more

add dynamic search without javascript libraries in jekyll

By -

Why Offer Search on a Static Jekyll Site

Jekyll is beloved for its speed and simplicity, but lacks native search functionality. Most tutorials recommend JavaScript-based libraries like Lunr.js or Algolia, which increase load time or require external dependencies. For small blogs or documentation sites, a fast, no-JavaScript alternative can provide a better experience, especially on low-end devices or slow connections.

Core Idea: Use Liquid and Static Index

Instead of building a full-text search in-browser, we can generate a searchable index during site build time and provide a filtered results page using Jekyll’s built-in Liquid templating. This method is lightweight, easy to maintain, and requires no additional libraries.

Step 1: Create a Search Input Form

Create a page named search.html in the root or _pages directory with a search input:

---
layout: default
title: Search
permalink: /search/
---

Search this site

Step 2: Build a Static Index Using Liquid

On the same search.html page, below the form, loop through all site posts and filter them using the search term from the URL query:

{% raw %}
{% assign search_query = page.url | split: '?' | last | split: 'q=' | last | uri_decode %}
{% if search_query != '' %}
  
Results for "{{ search_query }}"

  
    
  {% for post in site.posts %}
    {% if post.title contains search_query or post.content contains search_query %}
      
  • {{ post.title }}
    • 
    {% endif %}
  {% endfor %}
  

{% else %}
  
Enter a keyword to search posts.

{% endif %}
{% endraw %}

This example decodes the query from the URL and compares it against post titles and content.

Step 3: Ensure Posts Are Indexed Properly

Make sure your posts have meaningful content in the body and proper YAML front matter, since this method searches through the title and content.

Step 4: Improve Results with Custom Filters

If performance is a concern, or if your blog has hundreds of posts, you can restrict the loop to a recent number of posts, or pre-filter based on tags or categories.

{% raw %}
{% assign recent_posts = site.posts | slice: 0, 100 %}
{% for post in recent_posts %}
  {% if post.tags contains search_query %}
    
  • {{ post.title }}
    • 
  {% endif %}
{% endfor %}
{% endraw %}

    Advantages of This Method

    • No JavaScript required
    • Fully static — works with GitHub Pages and Netlify
    • Very fast search for small to medium sites
    • No reliance on third-party APIs

    Limitations

    • Basic matching — no stemming or typo correction
    • Only works after page reload (no instant results)
    • Can't highlight matching terms in snippets

    Optional: Add Serverless Enhancement

    For larger projects, consider using a hybrid approach. Keep the lightweight fallback but offer enhanced results using Netlify Functions or a remote index via JSON, triggered only when JavaScript is enabled. This ensures progressive enhancement without compromising base performance.

    Conclusion

    Adding search functionality to a Jekyll site doesn't have to be complex. By leveraging Liquid and build-time indexing, you can implement a simple and fast search feature with zero dependencies. This method is ideal for small blogs, documentation, or resource sites focused on speed, privacy, and simplicity.

    Read more

    organize folder structure for seo in jekyll

    By -

    Why Folder Structure Matters for SEO

    Even though Jekyll generates static HTML files, the way you organize your source folders impacts your URL structure, site navigation, and crawlability by search engines. A well-thought folder hierarchy ensures clean URLs, easier content management, and better user experience—factors that indirectly influence SEO.

    Key Components of a Jekyll Site Structure

    Here are the main folders and files you will manage in Jekyll:

    • _posts/: Contains blog posts in markdown with date-prefixed filenames
    • _pages/ or root-level markdown files: Static pages like About, Contact, etc.
    • _layouts/: HTML templates that control the look of pages
    • _includes/: Reusable HTML partials included in layouts or posts
    • assets/ or images/: Static files like images, CSS, and JavaScript
    • _data/: YAML or JSON files for site data used in templates

    Best Practices for SEO-Friendly Folder Structure

    1. Use Meaningful Folder Names

    Keep folder names descriptive and simple. Avoid underscores or spaces in URLs generated from folder names to maintain readability.

    2. Leverage Permalinks in Front Matter

    Control URL structure precisely using the permalink attribute in page/post front matter or _config.yml. This allows you to flatten or nest URLs independently from folder location.

    3. Organize Content by Topic or Category

    For blogs with multiple categories, consider grouping posts in subfolders matching categories. For example:

    _posts/technology/2025-05-25-post-title.md
_posts/marketing/2025-05-20-another-post.md

    Then use permalinks to keep URLs neat, e.g., /technology/post-title.

    4. Separate Static Pages Clearly

    Keep pages like About, Privacy Policy, and Contact in a dedicated folder like _pages or root folder, avoiding clutter among posts.

    5. Store Media in assets Folder

    Store images, CSS, JS, and fonts under assets/. Reference these files with absolute or relative URLs for better caching and performance.

    6. Avoid Deep Nesting

    Limit folder depth to prevent overly complex URLs. Deeply nested URLs can be harder to remember, share, and sometimes negatively impact crawling efficiency.

    Example Folder Structure for a Jekyll Blog

    /
├── _posts/
│   ├── technology/
│   │   ├── 2025-05-25-ai-trends.md
│   │   └── 2025-04-18-cloud-computing.md
│   ├── marketing/
│   │   ├── 2025-05-20-content-strategy.md
│   │   └── 2025-03-10-seo-tips.md
├── _pages/
│   ├── about.md
│   ├── contact.md
│   └── privacy.md
├── _layouts/
│   ├── default.html
│   └── post.html
├── _includes/
│   ├── header.html
│   └── footer.html
├── assets/
│   ├── css/
│   │   └── main.css
│   ├── js/
│   │   └── scripts.js
│   └── images/
│       ├── logo.png
│       └── banner.jpg
├── _data/
│   └── navigation.yml
├── _config.yml
└── index.md

    Controlling URL Structure via Permalinks

    Modify your _config.yml to set global permalink patterns, for example:

    permalink: /:categories/:title/

    This tells Jekyll to generate URLs like /technology/ai-trends/. You can override permalinks per post or page for specific cases.

    Using Categories and Tags for SEO

    Organize posts with categories and tags to enable category pages and tag archives. These pages create additional entry points for search engines and users.

    Generate Category Pages

    Use plugins or manual pages to list posts by category. Structure these URLs cleanly, e.g., /category/technology/.

    Tag Pages

    Similarly, create tag pages with URLs like /tag/seo/. Both category and tag pages should have good meta titles and descriptions.

    Improving Crawlability and Indexing

    Ensure your folder and URL structure avoids duplicate content and respects canonical URLs. Use:

    • rel="canonical" tags in layouts
    • Consistent URL formats (trailing slash or no trailing slash)
    • Sitemaps reflecting actual URL structure

    Conclusion

    A clean, logical folder structure in your Jekyll project is foundational for SEO success. By aligning folder organization with your content strategy, controlling URLs via permalinks, and ensuring easy navigation, you improve both user experience and search engine visibility. Take time to plan your site structure before populating it with content to save headaches later.

    Read more

    migrate wordpress site to jekyll without losing seo

    By -

    Why Move from WordPress to Jekyll

    Many site owners choose to move from WordPress to Jekyll for better performance, lower costs, improved security, and more control. Jekyll, being a static site generator, eliminates reliance on databases and server-side processing, resulting in lightning-fast loading times and fewer security vulnerabilities. However, the migration must be planned carefully to avoid damaging existing SEO rankings, backlinks, or site traffic.

    Understanding the SEO Risks in Migration

    Before migrating from WordPress to Jekyll, it’s important to understand what you stand to lose if done improperly:

    • Loss of indexed URLs and backlinks due to broken links or changed permalinks
    • Disruption in metadata and schema markup that search engines rely on
    • Loss of image alt tags and media URLs
    • Broken canonical URLs and Open Graph data

    The goal of a successful migration is to preserve all existing SEO signals, maintain search engine visibility, and improve the technical health of the site.

    Pre-Migration Checklist

    1. Perform a Full Site Backup

    Before doing anything else, export your entire WordPress site including:

    • Posts and pages (XML export via Tools > Export)
    • Images and uploads (via FTP or File Manager)
    • Custom fields, taxonomies, and user-defined metadata

    2. Crawl Your Current Site

    Use Screaming Frog or a similar crawler to capture a full snapshot of URLs, titles, meta descriptions, header structure, internal links, and redirect chains. This data will serve as a migration reference to ensure nothing gets lost.

    3. Identify Top-Performing Pages

    In Google Search Console and Google Analytics, identify your highest traffic and backlink-generating pages. These must be migrated first and preserved at all costs, ideally with no change in URL structure.

    4. Set Up a Staging Environment

    Build your Jekyll site in a separate GitHub repository or local environment before replacing your live site. This allows you to test everything before going public.

    Exporting WordPress Content to Jekyll

    1. Use WordPress-to-Jekyll Exporter Plugins

    Use the plugin “Jekyll Exporter” to convert all posts, pages, and metadata into markdown files with front matter. It will also export media and generate a folder structure for _posts, _pages, and _data.

    2. Clean Up Exported Markdown Files

    Manually review and edit the exported markdown files:

    • Verify YAML front matter is correctly formatted
    • Ensure title, date, description, and tags are preserved
    • Fix any broken image references or internal links

    3. Maintain Permalink Structure

    If your WordPress used a custom permalink (e.g., /year/month/title), configure Jekyll accordingly in your _config.yml:

    permalink: /:year/:month/:title/

    Preserving SEO Metadata and Open Graph Tags

    1. Use Front Matter for SEO Tags

    Jekyll supports SEO metadata via YAML front matter. Include fields like:

    title: "How to Migrate to Jekyll"
description: "Comprehensive migration checklist to move your WordPress site to Jekyll without hurting SEO."
keywords: "jekyll migration, wordpress to jekyll, static blog migration"

    2. Add SEO-Friendly Head in Layout

    Ensure your HTML layout includes metadata tags for title, description, canonical URL, and Open Graph:

    {{ page.title }}

    3. Create Schema Markup Manually

    You can hardcode schema JSON-LD in each post or insert it dynamically using Liquid tags. Structured data helps Google better understand your site content.

    Managing Redirects

    1. Set Up 301 Redirects for URL Changes

    If any URLs change, use redirect rules in your hosting platform (e.g., Netlify's _redirects file):

    /old-url  /new-url  301

    2. Preserve Slugs When Possible

    It’s best to avoid changing URLs altogether. If you must, ensure old links from external sites still resolve correctly through redirection.

    3. Maintain Sitemap and Robots.txt

    Regenerate your sitemap and robots.txt to reflect the new static structure. Submit the updated sitemap in Google Search Console immediately after migration.

    Handling Images and Media Files

    1. Move All Media to the /assets Folder

    Jekyll expects static files like images to live in the /assets directory. Update all image references in markdown accordingly.

    2. Preserve ALT Tags

    If images had alt attributes in WordPress, make sure they are preserved in markdown or HTML image tags. ALT tags help with image SEO and accessibility.

    Testing and Deployment

    1. Use a Local Jekyll Server for Preview

    Run bundle exec jekyll serve to preview your site and check for broken links or layout issues.

    2. Validate SEO with Tools

    • Use Google Lighthouse for on-page SEO audits
    • Use Ahrefs or Screaming Frog to crawl and check internal links
    • Test structured data with Google's Rich Results Tool

    3. Deploy with GitHub Pages or Netlify

    Choose your preferred static hosting platform. GitHub Pages is integrated with Jekyll, while Netlify offers redirect rules, form handling, and CI/CD out of the box.

    Case Study: A Blog’s Seamless SEO Migration

    Background

    A digital marketing blog with 500+ articles moved from WordPress to Jekyll to improve speed and reduce hosting costs. SEO traffic accounted for 80% of their sessions.

    Migrated Elements

    • Permalinks maintained exactly
    • 301 redirects added for old media URLs
    • Structured metadata embedded in every post
    • Custom sitemap and robots.txt rebuilt

    Post-Migration Results

    • Page speed improved from 2.8s to 0.6s
    • Core Web Vitals scores all turned green
    • SEO traffic dropped slightly for 2 weeks then recovered fully
    • Manual URL inspection showed successful indexing of all key pages

    Tips for a Smooth Transition

    1. Run Both Sites Temporarily

    Keep the WordPress site live (on a subdomain or hidden route) while building the Jekyll version. This reduces pressure and allows side-by-side testing.

    2. Announce the Change to Google

    Use the “Change of Address” tool in Search Console only if the domain changes. Otherwise, just resubmit your sitemap and request re-indexing for priority pages.

    3. Watch Performance Metrics Closely

    Monitor GSC and Analytics daily for crawl errors, traffic dips, or indexing issues during the first 2–4 weeks.

    Conclusion: Jekyll Migration Done Right

    Moving from WordPress to Jekyll offers performance, security, and maintenance advantages. However, SEO must be treated as a priority throughout the process. By preserving permalinks, front matter metadata, image alt tags, and internal link structures, you can retain your search visibility and even improve it post-migration. With thoughtful planning and clean implementation, the switch to Jekyll can be seamless, powerful, and future-proof.

    Read more

    internal linking tactics to improve jekyll seo

    By -

    Why Internal Linking Matters in SEO

    Internal linking is the practice of linking one page of your website to another page within the same domain. It serves two primary purposes: helping search engines understand the structure and hierarchy of your content, and guiding users to related or valuable pages. For Jekyll-based blogs, this is especially important, as there is no database or plugin engine to automate link recommendations.

    Without a proper internal linking strategy, even well-written blog posts can remain orphaned, uncrawled, and underperforming in search results. When implemented well, internal links distribute link equity, improve crawlability, and reduce bounce rates by offering readers meaningful navigation paths.

    How Jekyll Handles Internal Links

    Since Jekyll is a static site generator, internal linking requires a manual or semi-automated approach using Liquid templating. Unlike WordPress, you won't find built-in suggestions or visual link pickers. But this also means you have complete control over how links are structured, how they’re rendered, and where they appear.

    Basic Syntax of Internal Linking

    In Markdown or HTML, you can link to another page using relative paths or the relative_url and absolute_url filters in Jekyll:

    Read more about this topic

    This ensures the link works correctly regardless of your site’s base URL or deployment environment.

    Building a Flat and Crawlable Site Structure

    1. Keep Your Content Within Reach

    Ensure that any post or page can be reached within 2–3 clicks from the homepage. Deep nesting of content leads to crawl issues and lower visibility for older posts.

    2. Use Topic Clusters

    Organize content into thematic clusters where a core post links to and from related articles. This reinforces topical authority and distributes link equity effectively.

    3. Link From High-Traffic Posts to Newer Ones

    Identify your top-performing posts using analytics, and insert contextual links pointing to new or less-visited pages. This boosts visibility of recent content while improving session duration.

    Practical Techniques for Internal Linking in Jekyll

    1. Related Posts Section Using Categories

    You can dynamically list related articles using the same category:

    {% raw %}

      
  {% for post in site.categories[page.categories[0]] %}
    {% if post.url != page.url %}
      
    • {{ post.title }}
      • 
    {% endif %}
  {% endfor %}

    
{% endraw %}

    This ensures that each post provides a set of relevant next steps, keeping users engaged and search bots crawling.

    2. Manual In-Content Linking with Liquid Tags

    When referencing another post inside your content, use this pattern:

    SEO Checklist

    Or use post object data for dynamic linking:

    {% raw %}
{% assign target = site.posts | where:"title","how to optimize front matter for seo" | first %}
{{ target.title }}
{% endraw %}

    3. Create Category Landing Pages

    Each category can have its own page summarizing its content. This helps with topical relevance and internal structure:

    Posts on Jekyll SEO
    

      
  {% raw %}
  {% for post in site.categories.jekyll %}
    
    • {{ post.title }}
      • 
  {% endfor %}
  {% endraw %}

    4. Use Tag Indexes for Cross-Linking

    Tags allow cross-topic discovery. Create a tag index page that links to all posts using that tag, improving lateral linking opportunities.

    5. Add “Read Next” Suggestions at the Bottom

    Simple hardcoded suggestions or dynamic selections help maintain engagement after the main content ends:

    Read Next

    Case Study: Improving SEO with Internal Linking on a Developer Blog

    Background

    A software developer started a Jekyll blog focused on programming tutorials. Over 80% of their traffic came to just three posts, while the rest of the site remained unseen. Bounce rate hovered around 70%, and average session duration was under 1 minute.

    Initial Structure

    • Homepage linked only to the 5 most recent posts
    • No links between posts
    • Category and tag pages existed but were orphaned

    Strategic Improvements

    • Created a dynamic “Related Posts” section using category matching
    • Added a “You may also like” list at the end of each post
    • Linked older posts inside new tutorials as background references
    • Built a sidebar with permanent links to cornerstone content

    Results After 6 Weeks

    • Page views per session increased by 41%
    • Bounce rate dropped to 48%
    • Organic impressions increased for pages that were previously invisible
    • Average session duration reached 2 minutes and 10 seconds

    Common Pitfalls to Avoid

    1. Linking Without Context

    Don’t just drop a link randomly—surround it with a reason why it’s relevant. Search engines prefer contextual links with semantic meaning.

    2. Orphan Pages

    Always ensure that every post is linked from at least one other post. Use your sitemap or a site crawler to detect orphaned pages.

    3. Broken Links After Renaming URLs

    Because Jekyll is static, any URL change must be updated manually across all linking pages. Consider using redirects if the site supports it (via Netlify or a reverse proxy).

    Monitoring Internal Link Performance

    Use Google Search Console

    Check the “Links” report under “Internal Links” to see which pages have the most and fewest links. This helps you identify neglected content.

    Leverage Site Crawlers

    Tools like Screaming Frog or Ahrefs can crawl your static site and reveal link depth, orphaned URLs, and internal anchor distribution.

    Use Heatmaps and Session Recordings

    Tools like Hotjar help visualize which internal links users are actually clicking, revealing usability patterns and missed opportunities.

    Conclusion: Making Internal Links a Core SEO Asset

    In Jekyll, every link you place is intentional. With no plugins to fall back on, internal linking becomes a conscious part of your SEO and content design. When used wisely, it can dramatically improve how users engage with your site and how search engines evaluate and crawl your content.

    By using Liquid to dynamically insert links, designing useful navigation patterns, and tracking engagement, your Jekyll blog can rival the SEO structure of more complex CMS platforms. Internal linking is not just a technical detail—it’s a strategic lever for long-term organic growth.

    Read more
    Subscribe to: Comments (Atom)