IkeqIkeq

The whole problem with the world is that fools and fanatics are always so certain of themselves, but wiser people so full of doubts.

6Archives4Categories14Tags

Inside Theme — SEO & PWA

Jun 21, 2019

SEO (Search Engine Optimization)

Meta Generator Tag

Remove the <meta name="generator"> tag that Hexo adds to every page (recommended for cleaner HTML):

1
meta_generator: false

Set this in your main Hexo _config.yml, not the theme config.

Structured Data

Inside can render JSON-LD structured data in <head> for richer search results (breadcrumbs, article metadata, etc.):

1
2
3
4
seo:
  # Render structured-data schema in <head>
  # Default: false
  structured_data: true

This outputs standard Article, BreadcrumbList, and WebSite schema types that Google Search understands.

Server-Side Rendering (SSR)

Inside is built with Angular and outputs a full SPA by default. For SEO, this means search engine crawlers see an empty shell if you don’t pre-render.

Enable SSR mode:

1
2
3
4
seo:
  # Server-side render pages for crawlers
  # Default: false
  ssr: true

When ssr: true, Inside pre-renders the initial HTML on the server (using the _ssr.js bundle) so crawlers see fully populated content.

Note: SSR requires more server resources than static hosting. If you deploy to GitHub Pages or a static CDN, leave ssr: false and use structured_data: true instead for SEO benefits.

Sitemap

Hexo has an official hexo-generator-sitemap plugin. Install it:

1
npm install hexo-generator-sitemap --save

This auto-generates sitemap.xml at your site root on every build. No additional Inside configuration needed.

For Chinese search engines, also add:

1
npm install hexo-generator-baidurl --save

Canonical URLs

Set your production URL in Hexo’s _config.yml:

1
2
url: https://blog.oniuo.com
root: /

Hexo and Inside automatically generate <link rel="canonical"> tags pointing to the canonical URL of each page, preventing duplicate content issues.

Robots.txt

Place a robots.txt file in your source/ directory:

t User-agent: * Allow: / Disallow: /api/ Sitemap: https://blog.oniuo.com/sitemap.xml

PWA (Progressive Web App)

Inside has built-in PWA support via Google’s Workbox library. A properly configured PWA can be installed on mobile/desktop and works offline.

Enable Workbox (Service Worker)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
pwa:
  workbox:
    # Custom Workbox CDN (optional, defaults to Google's CDN)
    # cdn: https://g.alicdn.com/kg/workbox/3.3.0/workbox-sw.js
    # module_path_prefix: https://g.alicdn.com/kg/workbox/3.3.0/

    # Cache expiry in hours. Cached assets are purged after this.
    # Set to 0 for permanent caching (cache forever until next deploy).
    # Default: 4
    expire: 0

    # Service worker filename. Accessible at /sw.js
    name: sw.js

    # Custom caching rules
    rules:
      - name: jsdelivr
        strategy: staleWhileRevalidate
        regex: https://cdn\\.jsdelivr\\.net

      - name: gravatar
        strategy: staleWhileRevalidate
        regex: https://www\\.gravatar\\.com

      - name: theme-assets
        strategy: staleWhileRevalidate
        regex: /.*\\.(?:js|css|woff2|png|jpg|gif)$

      - name: api-json
        strategy: cacheFirst
        regex: /api/.*\\.json

Cache strategies:

Strategy Behavior
cacheFirst Use cached version; fall back to network
cacheOnly Only use cache, never network
networkFirst Try network; fall back to cache
staleWhileRevalidate Serve cached immediately; update cache in background

Web App Manifest

The manifest controls how your site appears when installed:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
pwa:
  manifest:
    short_name: Ikeq Blog
    name: Ikeq's Blog
    start_url: /
    theme_color: '#2a2b33'
    background_color: '#f5f7fa'
    display: standalone
    icons:
      - src: icon-194x194.png
        sizes: 194x194 512x512
        type: image/png
        purpose: any
      - src: icon-144x144.png
        sizes: 144x144
        type: image/png
        purpose: maskable

Generate icons at favicon.io or pwabuilder.com.

Complete PWA Configuration

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
pwa:
  workbox:
    expire: 0
    name: sw.js
    rules:
      - name: theme
        strategy: staleWhileRevalidate
        regex: /.*\\.(?:js|css|woff2|png|jpg|gif)$
      - name: google-fonts
        strategy: staleWhileRevalidate
        regex: https://fonts\\.googleapis\\.com
      - name: json
        strategy: cacheFirst
        regex: /api/.*\\.json

  manifest:
    short_name: Blog
    name: Ikeq's Blog
    start_url: /
    theme_color: '#2a2b33'
    background_color: '#f5f7fa'
    display: standalone
    icons:
      - src: /images/icon-194x194.png
        sizes: 194x194 512x512
        type: image/png

Google Analytics

Add a Google Analytics tracking ID:

1
ga: UA-00000000-0

Inside injects the GA tracking script into every page automatically.

For GA4, use the newer gtag.js approach via the plugin injection system instead.

Next Steps

Buy me a cup of milk 🥛.

支
SEO (Search Engine Optimization)
Meta Generator Tag
Structured Data
Server-Side Rendering (SSR)
Sitemap
Canonical URLs
Robots.txt
PWA (Progressive Web App)
Enable Workbox (Service Worker)
Web App Manifest
Complete PWA Configuration
Google Analytics
Next Steps