(docs) Expand references to custom CSS/JS page, add a common use cases section for JS (#881)

Author: devalog

fern/products/docs/pages/component-library/custom-components/custom-css-js.mdx

@@ -9,6 +9,8 @@ Custom CSS & JS are available on the Basic plan.
 Adding Custom Components is available on the Pro plan.
 </Note>
 
+This page covers how to customize your docs with CSS, JavaScript, and custom components. However, you can [customize many things directly in your `docs.yml` file](/docs/configuration/what-is-docs-yml), including colors, typography, navbar links, layout, analytics, and metadata. Try these built-in options first before adding custom code. 
+
 ## Custom CSS
 
 You can add custom CSS to your docs to further customize the look and feel. The defined class names are applied across all MDX files.
@@ -194,6 +196,12 @@ js:
 ```
 </CodeBlock>
 
+### Common use cases
+
+- Integrate with [third-party platforms](/docs/integrations/overview) that Fern doesn't natively support
+- Implement custom search (also requires [your Algolia credentials](/docs/customization/search))
+- Insert scripts and widgets
+
 ## Custom components
 
 You can use custom CSS and JS to replace Fern's default UI components with your own. The `header` and `footer` 

fern/products/docs/pages/component-library/default-components/overview.mdx

@@ -34,6 +34,8 @@ This will automatically render a card with the title, icon, and content you spec
 
 Want to bring your own UI components, such as a custom header and footer? You can on the Enterprise plan. [Contact us](https://buildwithfern.com/contact) to learn more.
 
+For styling and functionality customizations, see [Custom CSS & JavaScript](/docs/customization/custom-css-js).
+
 ## Requests for new components
 
 Have a component in mind that you'd like to see in Fern? Let us know by filing a [GitHub Issue](https://github.com/fern-api/fern/issues/new?assignees=&labels=&projects=&template=feature-request.md&title=%5BFeature%5D).

fern/products/docs/pages/customization/frontmatter.mdx

@@ -4,7 +4,7 @@ subtitle: Set titles, add meta descriptions, and more
 description: Use frontmatter to set a variety of page properties and metadata.
 ---
 
-You can optionally use frontmatter to set each page's title, full slug override, meta description, a URL to suggest edits to the page, and its OpenGraph image. You can also use frontmatter to disable certain page elements like the table of contents and on-page feedback. 
+You can optionally use frontmatter to set each page's title, full slug override, meta description, a URL to suggest edits to the page, and its OpenGraph image. You can also use frontmatter to disable certain page elements like the table of contents and on-page feedback. For advanced styling and functionality customizations beyond frontmatter options, see [custom CSS and JavaScript](/docs/customization/custom-css-js). 
 
 Frontmatter must be added to the top of a `.md` or `.mdx` file, before the rest of the content. Use sets of three dashes to indicate the beginning and end of your frontmatter, as shown:
 

fern/products/docs/pages/customization/search.mdx

@@ -42,4 +42,4 @@ Contact the Fern team to get your specific application ID and index name. Creden
 
 ## Using an alternative search 
 
-You can override Fern's search with your own solution. To learn more, see [Custom JavaScript](/learn/docs/building-and-customizing-your-docs/custom-css-global-js#custom-javascript).
+You can override Fern's search with your own solution using [custom JavaScript](/learn/docs/building-and-customizing-your-docs/custom-css-global-js#custom-javascript) and your Algolia credentials.

fern/products/docs/pages/customization/what-is-docs-yml.mdx

@@ -4,6 +4,8 @@ subtitle: "Customize your documentation using the docs.yml file"
 description: "Learn how to configure your Fern documentation site with the docs.yml file. Customize colors, typography, layout, analytics and more."
 ---
 
+The `docs.yml` file is your primary tool for customizing your documentation site, including colors, typography, layout, analytics, and more. Start here for most customization needs before considering [custom CSS and JavaScript](/docs/customization/custom-css-js) for advanced use cases.
+
 ### YAML Schema Validation
 
 To enable intelligent YAML validation and autocompletion in your editor, add this line at the top of your `docs.yml` file:

fern/products/docs/pages/integrations/overview.mdx

@@ -94,3 +94,7 @@ are available during the workflow run.
   The Postman integration is not configured in `docs.yml`. Check out this [page](/learn/docs/integrations/postman) to
   learn more.
 </Info>
+
+## Connect other integrations
+
+If you want to integrate with a third-party analytics or support platforms that Fern doesn't directly support, you can do so [using custom JS](/docs/customization/custom-css-js#custom-javascript). 

fern/products/docs/pages/navigation/announcement-banner.mdx

@@ -10,4 +10,4 @@ announcement:
     message: "🚀 New feature: Announcements are available! (<a href=\"https://buildwithfern.com/learn/docs/building-your-docs/announcements\" target=\"_blank\">Learn more</a>) 🚀"
 ```
 
-Markdown and HTML is supported in the announcement message. You can include links, images, and other formatting. [Custom CSS](/learn/docs/building-your-docs/custom-css-global-js#custom-css) can be used to customize the style of the announcement.
+Markdown and HTML is supported in the announcement message. You can include links, images, and other formatting. [Custom CSS](/docs/customization/custom-css-js#custom-css) can be used to customize the style of the announcement.