> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.weltpixel.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# How to customize category pages with Pearl Theme for Magento 2 ?

You can customize individual **category pages** in the Pearl Theme by adding **CSS** and **JS** directly from the Magento Admin. Pearl introduces dedicated fields so you can target a single category without editing theme files.

---

## Configure Global Breakpoints and CSS

Set your responsive breakpoints in:  
**WeltPixel → Pearl Theme Options → Frontend Options → Breakpoints**

- Define breakpoints for mobile, tablet, and large screens.
- Use **Custom Global CSS** to apply CSS **site-wide**, regardless of screen size.

---

## Add Category-Specific CSS/JS

Go to:  
**Products → Categories → [your category] → WeltPixel Options**

- Insert **Custom CSS** for this category only.  
- Insert **Custom JS** for this category only.  
- Combine with your breakpoint setup to tailor styles per device.

> Tip: Add only the selectors and declarations needed for this category page.

![img_44.png](https://storage.crisp.chat/users/helpdesk/website/-/c/3/5/7/c357881dc7f6d800/fb86357e-4d1e-496b-9f68-e69799_rd9nsy.png)

---

## Additional Category Page Options (WeltPixel Options)

- **Hide Page Title** — Remove the category page H1.
- **Hide Breadcrumbs** — Hide the breadcrumb trail on this category.
- **Custom Link** — Define a link for the category tile:
  - Use `http://yourcustomlink.com` for an **external** link.
  - Use `/yourpage.com` to create a **dynamic internal** link (relative to base URL).
  - Use `#` to **disable** the link.
- **Open in New Tab** — Set to **Yes** to open the custom link in a new tab.
- **Exclude from Sitemap** — Set to **Yes** to exclude this category from the XML sitemap.

![img_31.png](https://storage.crisp.chat/users/helpdesk/website/-/4/1/c/2/41c22208183b8c00/551035bb-91b7-4073-a8d2-bad4e1_1kf559d.png)

---

## Workflow Summary

1. Configure breakpoints and global CSS in **Pearl Theme Options**.
2. Open the target category and add **category-specific CSS/JS** in **WeltPixel Options**.
3. Adjust page-level options (hide title/breadcrumbs, custom link, sitemap exclusion) as needed.
4. **Save** and clear relevant caches (Regenerate Pearl Theme CSS, Flush Magento Cache, and Browser Cache if needed) to apply changes.