Dynamic SEO for CMS pages in No-Code - Mini Project: Build & Apply

Dynamic SEO for CMS pages

📖 Scenario: You manage a website with many pages created using a Content Management System (CMS). Each page needs unique SEO information like title, description, and keywords to help search engines understand and rank the page better.Instead of manually adding SEO details to every page, you want to set up a system that automatically generates SEO tags based on the page content and settings.

🎯 Goal: Build a simple plan to dynamically generate SEO tags for CMS pages so that each page has a unique and relevant title, description, and keywords without manual editing.

📋 What You'll Learn

Create a data structure to hold page information including title and content

Add a configuration setting for the default SEO description length

Write a logic step to generate SEO description by trimming page content to the configured length

Complete the setup by defining the final SEO tags structure for each page

💡 Why This Matters

🌍 Real World

Websites with many pages need unique SEO tags to improve search engine ranking and user experience. Automating SEO tag creation saves time and ensures consistency.

💼 Career

Web developers, content managers, and SEO specialists often work together to optimize websites. Understanding dynamic SEO helps in building scalable and maintainable web projects.

1

DATA SETUP: Create page data structure

Create a dictionary called pages with two entries: 'home' and 'about'. Each entry should be another dictionary with keys 'title' and 'content'. Use these exact values:
'home': {'title': 'Welcome to Our Site', 'content': 'Discover amazing products and services tailored for you.'}
'about': {'title': 'About Us', 'content': 'Learn about our mission, vision, and team dedicated to excellence.'}

No-Code

# Create the pages dictionary with 'home' and 'about' entries
# Your code here

Hint

Use a dictionary with keys 'home' and 'about'. Each key maps to another dictionary with keys 'title' and 'content'.

2

CONFIGURATION: Add SEO description length setting

Create a variable called description_length and set it to 50. This will control how many characters of the page content are used for the SEO description.

No-Code

pages = {
    'home': {'title': 'Welcome to Our Site', 'content': 'Discover amazing products and services tailored for you.'},
    'about': {'title': 'About Us', 'content': 'Learn about our mission, vision, and team dedicated to excellence.'}
}
# Set the description length for SEO
# Your code here

Hint

Just create a variable named description_length and assign it the number 50.

3

CORE LOGIC: Generate SEO descriptions dynamically

Create a new dictionary called seo_descriptions. Use a for loop with variables page and info to iterate over pages.items(). For each page, set seo_descriptions[page] to the first description_length characters of info['content'].

No-Code

pages = {
    'home': {'title': 'Welcome to Our Site', 'content': 'Discover amazing products and services tailored for you.'},
    'about': {'title': 'About Us', 'content': 'Learn about our mission, vision, and team dedicated to excellence.'}
}
description_length = 50

# Create seo_descriptions dictionary with trimmed content
# Your code here

Hint

Use a for loop to go through each page and take a slice of the content up to description_length.

4

COMPLETION: Define final SEO tags structure

Create a dictionary called seo_tags. Use a for loop with variables page and info to iterate over pages.items(). For each page, set seo_tags[page] to a dictionary with keys 'title', 'description', and 'keywords'. Use info['title'] for 'title', seo_descriptions[page] for 'description', and an empty string '' for 'keywords'.

No-Code

pages = {
    'home': {'title': 'Welcome to Our Site', 'content': 'Discover amazing products and services tailored for you.'},
    'about': {'title': 'About Us', 'content': 'Learn about our mission, vision, and team dedicated to excellence.'}
}
description_length = 50

seo_descriptions = {}
for page, info in pages.items():
    seo_descriptions[page] = info['content'][:description_length]

# Create seo_tags dictionary with title, description, and keywords
# Your code here

Hint

Build a dictionary for each page with the required SEO keys and values.

Practice

1. What is the main benefit of using dynamic SEO for CMS pages?

easy

A. It automatically updates page titles and descriptions based on templates.

B. It requires manual editing of each page's SEO settings.

C. It disables search engines from indexing the pages.

D. It removes all metadata from the pages.

Solution

1. Step 1: Understand what dynamic SEO does

   Dynamic SEO uses templates to automatically update page titles and descriptions.

2. Step 2: Compare options with this understanding

   Only It automatically updates page titles and descriptions based on templates. describes automatic updating using templates, which is the main benefit.

3. Final Answer:

   It automatically updates page titles and descriptions based on templates. -> Option A

4. Quick Check:

   Dynamic SEO = automatic updates [OK]

Hint: Dynamic SEO means automatic updates using templates [OK]

Common Mistakes:

• Thinking dynamic SEO requires manual edits
• Confusing dynamic SEO with disabling indexing
• Believing it removes metadata

2. Which placeholder syntax is commonly used to insert page-specific information in dynamic SEO templates?

easy

A. {{page_title}}

B. <page_title>

C. [page_title]

D. (page_title)

Solution

1. Step 1: Identify common placeholder formats

   Double curly braces like {{placeholder}} are widely used in templates for dynamic content.

2. Step 2: Match the correct syntax

   {{page_title}} uses {{page_title}}, which is the standard placeholder format for dynamic SEO templates.

3. Final Answer:

   {{page_title}} -> Option A

4. Quick Check:

   Placeholders use double curly braces {{}} [OK]

Hint: Look for double curly braces {{}} for placeholders [OK]

Common Mistakes:

• Using angle brackets instead of curly braces
• Confusing square brackets with placeholders
• Using parentheses which are not standard

3. Given a dynamic SEO template: "Buy {{product_name}} at {{store_name}} - Best Prices", what would be the title for a page where product_name = 'Coffee Maker' and store_name = 'HomeGoods'?

medium

A. Buy Coffee Maker at {{store_name}} - Best Prices

B. Buy {{product_name}} at {{store_name}} - Best Prices

C. Buy Coffee Maker at HomeGoods - Best Prices

D. Buy HomeGoods at Coffee Maker - Best Prices

Solution

1. Step 1: Replace placeholders with given values

   Replace {{product_name}} with 'Coffee Maker' and {{store_name}} with 'HomeGoods'.

2. Step 2: Form the final title

   The title becomes "Buy Coffee Maker at HomeGoods - Best Prices".

3. Final Answer:

   Buy Coffee Maker at HomeGoods - Best Prices -> Option C

4. Quick Check:

   Replace placeholders correctly = Buy Coffee Maker at HomeGoods - Best Prices [OK]

Hint: Replace placeholders with actual page info [OK]

Common Mistakes:

• Not replacing placeholders at all
• Swapping values incorrectly
• Leaving some placeholders unreplaced

4. A CMS page's SEO title template is set as "{{title}} - {{site_name}}", but the page shows the title literally as {{title}} - {{site_name}}. What is the likely cause?

medium

A. The CMS automatically replaces placeholders with values.

B. The placeholders are case-insensitive and should be lowercase.

C. The page has no title or site name set, so placeholders remain.

D. Placeholders are not recognized because the template syntax is incorrect.

Solution

1. Step 1: Understand why placeholders show literally

   If placeholders appear as text, the system likely does not recognize the syntax.

2. Step 2: Identify the cause

   Incorrect or unsupported template syntax causes placeholders to not be replaced.

3. Final Answer:

   Placeholders are not recognized because the template syntax is incorrect. -> Option D

4. Quick Check:

   Unrecognized syntax = placeholders show literally [OK]

Hint: Check if template syntax matches CMS requirements [OK]

Common Mistakes:

• Assuming missing data causes literal placeholders
• Thinking CMS always replaces placeholders automatically
• Ignoring case sensitivity issues

5. You want to create a dynamic SEO description for blog posts that includes the post title and author name. Which template below correctly uses placeholders to achieve this?

hard

A. "Read '[post_title]' by [author_name] - Insights and tips"

B. "Read '{{post_title}}' by {{author_name}} - Insights and tips"

C. "Read '<post_title>' by <author_name> - Insights and tips"

D. "Read '(post_title)' by (author_name) - Insights and tips"

Solution

1. Step 1: Identify correct placeholder syntax

   Dynamic SEO templates use double curly braces {{}} for placeholders.

2. Step 2: Check each option for correct syntax

   Only "Read '{{post_title}}' by {{author_name}} - Insights and tips" uses {{post_title}} and {{author_name}} correctly inside the string.

3. Final Answer:

   "Read '{{post_title}}' by {{author_name}} - Insights and tips" -> Option B

4. Quick Check:

   Correct placeholders use {{}} brackets [OK]

Hint: Use double curly braces {{}} for placeholders in templates [OK]

Common Mistakes:

• Using angle, square, or round brackets instead of curly braces
• Forgetting to include placeholders inside quotes
• Mixing placeholder syntax styles