# Create a Location-Based Programmatic Job Page

Programmatic job pages help your job board rank for high-intent keywords like “**Jobs in San Francisco**” or “**Jobs in California**”. Each page dynamically shows relevant job listings for that location, while still looking like a genuine, content-rich page to search engines.

### Steps to set up a Programmatic Job Page

1. #### Log in to Admin Panel
   1. Go to your admin side of the Job Board.\
      Example: <mark style="color:$success;"><https://abx.arthajobboard.com/admin></mark>
2. **Open Manage Portal**
   1. From the menu, click Manage Portal.<br>

      <figure><img src="/files/PqzYxnkZVgV0BYRUUNk9" alt=""><figcaption></figcaption></figure>
3. **Embed the Location Script**
   1. Navigate to Embed Script.
   2. Copy and paste the following JavaScript code into the Footer Script section.<br>

      <figure><img src="/files/1pgIX8fPRCeUKXgRLxbM" alt=""><figcaption></figcaption></figure>
   3. Here's the JavaScript code:

```javascript
// JavaScript code
<script>
    document.addEventListener('DOMContentLoaded', () => {
        const currentPathname = window.location.pathname; // e.g., '/jobs-in-san-francisco'
        const currentSearch = window.location.search;   // e.g., '' or '?existing=param'

        // Updated regex to capture single or multiple words with hyphens/underscores
        const regex = /^\/jobs-in-([a-zA-Z0-9_-]+(?:-[a-zA-Z0-9_-]+)*)$/;
        const match = currentPathname.match(regex);

        if (match) {
            // Convert slug to readable city name: 'san-francisco' -> 'San Francisco'
            let citySlug = match[1];
            let city = citySlug.replace(/-/g, " ").replace(/_/g, " ");
            city = city.replace(/\b\w/g, char => char.toUpperCase()); // Capitalize words

            const newQueryString = `?city=${encodeURIComponent(city)}&page=1`;

            // Only update the URL if the parameters are not already present
            if (!currentSearch.includes(`city=${encodeURIComponent(city)}`) || !currentSearch.includes(`page=1`)) {
                history.pushState(null, '', currentPathname + newQueryString);
                console.log(`City detected: ${city}`);
                console.log(`URL state updated to: ${window.location.pathname}${window.location.search}`);
            } else {
                console.log(`City detected: ${city}`);
                console.log("URL already contains the desired parameters. No action needed.");
            }
        } else {
            console.log("Current URL slug does not match the /jobs-in-{city} pattern. No city filter simulation will occur.");
        }
    });
</script>
```

4. **Add Pages for Each Location**
   1. Create a new page for each location.
   2. **Example**:&#x20;
      1. Page Title: **Jobs in California**
      2. Slug: <mark style="color:$success;">jobs-in-california</mark>
      3. <mark style="color:$success;">All programmatic pages</mark> <mark style="color:$success;"></mark><mark style="color:$success;">**must**</mark> <mark style="color:$success;"></mark><mark style="color:$success;">follow this exact pattern: jobs-in-{{city-name}}</mark>
      4. <mark style="color:$success;">If the slug pattern is changed (e.g., /careers-in-california or /california-jobs), the script will</mark> <mark style="color:$success;"></mark><mark style="color:$success;">**not**</mark> <mark style="color:$success;"></mark><mark style="color:$success;">work.</mark>
   3. Add the "**Browse Jobs" widget** so the jobs for that city are displayed dynamically.<br>

      <figure><img src="/files/bA3XnjhcH9QvbYhCvPRv" alt=""><figcaption></figcaption></figure>
5. **Add Custom Widgets (Critical for SEO)**
   1. At the bottom of each page, add a custom text widget.
   2. Example content:

      “California has one of the largest healthcare job markets in the US. Explore nursing, caregiving, and hospital jobs in major cities like Los Angeles, San Diego, and San Francisco.”
   3. #### <mark style="color:$warning;">Why is this important?</mark>
      1. Search engines penalize duplicate content.\
         If multiple pages only show job listings with no unique text, they may be flagged as “thin content.”
      2. Adding custom descriptive text:
         1. Makes the page look genuine.
         2. Adds keyword-rich content (helping SEO).
         3. Improves user experience with helpful info.
   4. This is similar to what Flipkart does on product listing pages — they add explanatory text at the bottom so the page is not just a filtered search result but a rich content page.
6. **Make the Pages More Appealing for SEO**
   1. #### Add Interlinking
      1. **Blog Pages** – Link to guides like:
         1. “Top 10 Healthcare Jobs in California”
         2. “How to Find Nursing Jobs in Los Angeles”
      2. **Category Pages** – Example: \
         On “Jobs in San Francisco”, link to:\
         \[Caregiver Jobs in San Francisco]\
         \[Nursing Jobs in San Francisco]
      3. **Company Pages** – Interlink employer pages:
         1. “View jobs from Kaiser Permanente in California”
   2. #### Additional SEO Boosters
      1. **Add FAQs** to each page:\
         “How to apply for jobs in California?”\
         “Which companies are hiring nurses in San Diego?”
      2. **Local SEO**: Mention nearby cities & industries.
      3. **Schema Markup**: Ensure job schema is applied correctly.
      4. **Backlinks**: Build backlinks from local directories, colleges, or healthcare organizations.
7. **Define SEO for Programmatic Pages**
   1. After creating each location page, you should also configure its **SEO settings** in the admin panel so that search engines can properly index and rank it.
   2. **Steps**:
      1. Go to the page you just created (e.g., <mark style="color:$success;">/jobs-in-california</mark>) in the **Admin Panel → Manage Portal → Pages.**
      2. Open the **SEO Management** option for that page.\
         (You’ll see fields like Meta Title, Meta Description, Canonical URL, Author, and Cover Photo — as shown in the screenshot).<br>

         <figure><img src="/files/f5yjtUdh35PrzfvQPxnx" alt=""><figcaption></figcaption></figure>
      3. Fill in the fields:
         1. **Meta Title**: Keep it clear and keyword-rich.\
            Example: Jobs in California | Care Hire USA
         2. **Meta Description**: Add a short, compelling description (150–160 characters) with the city and job types.\
            Example: Find healthcare, nursing, and caregiving jobs in California. Apply today with Care Hire USA.
         3. **Canonical URL**: Use the full page URL (e.g., <mark style="color:$success;"><https://yourdomain.com/jobs-in-california></mark>) to avoid duplicates.
         4. **Cover Photo**: Upload a location/industry-related image (120×120 px min, ≤2 MB). This also helps with social previews.
   3. <mark style="color:$warning;">**Why does this matter?**</mark>
      1. Ensures each page has **unique meta tags** (prevents duplicate title/description issues).
      2. Improves **CTR in search results** with better snippets.
      3. Helps Google clearly understand your page hierarchy with **canonical URLs**.
      4. Enhances **social sharing previews** with cover photos.
8. **New Interlinking Ideas**
   1. **State → City pages:**\
      From “Jobs in California” → link to “Jobs in Los Angeles”, “Jobs in San Diego”.
   2. **City → Nearby Cities:**\
      On “Jobs in San Francisco”, add “Jobs in Oakland” and “Jobs in San Jose”.
   3. **Industry-Specific:**\
      On “Jobs in New York”, link to “IT Jobs in New York” or “Healthcare Jobs in New York”.
   4. **Employer Spotlights:**\
      Add sections like “Top Hiring Companies in Chicago” linking to company pages.

### Expected Output

1. SEO-friendly programmatic job pages like:
   * <mark style="color:$success;">/jobs-in-california</mark>
   * <mark style="color:$success;">/jobs-in-new-york</mark>
   * <mark style="color:$success;">/jobs-in-san-francisco</mark>
2. Each page:
   * Shows jobs from the respective city only.
   * Has unique text widget content.
   * Interlinks to blog, category, and company pages.
   * Ranks for “**jobs in {city}**” keywords.

<figure><img src="/files/Q6cMmEILN8mvNosY7ZFC" alt=""><figcaption></figcaption></figure>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.arthajobboard.com/guides/create-a-location-based-programmatic-job-page.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.