Procedure for Posting CAS Insights Articles

Objective

This SOP outlines the step-by-step process for posting CAS Insights articles to ensure consistency and quality in publication.

Key Steps

1. Accessing the Draft Article 0:01

Start by clicking on the SharePoint link to access the CAS Insights articles.
Navigate to the section labeled 'Insights article' and select 'Draft'.

2. Creating a New CAS Insights Post 1:03

In Webflow CMS, go to 'CAS Insights' and click on 'New CAS Insights'.
Enter the post title in the designated field.

3. Editing the Slug 1:28

Edit the slug to make it shorter, using tools like Claude or customizing it manually.

4. Obtaining the Feature Image 2:06

Request the Getty image from designers Mariah or Tammy.
Ensure the image is downloaded and uploaded to the brand folder.

5. Optimizing the Image 2:50

Use TinyPNG to convert the image to AVIF format.
Download the optimized image for upload.

6. Adding Alt Text 3:13

Create descriptive alt text for the image, using an LLM if necessary.

7. Filling SEO Information 3:36

Set the SEO title to match the post title.
Update the meta description as needed.

8. Writing the Article Preview 3:54

Write a summary for the article preview that will appear on the main CAS Insights Index page.

9. Copying the Post Body 4:14

Copy the entire body of the article from the Word document, including images, and paste it into Webflow.

10. Formatting Headings 4:33

Remove any unwanted heading tags (e.g., h3, h2) from the titles and format them according to the guidelines.

11. Setting the Publish Date 5:10

Enter the publish date as specified, typically on Wednesdays or Fridays.

12. Removing Unnecessary Features 5:20

Remove the table of contents feature if it is not needed.

13. Categorizing the Article 6:14

Select the appropriate category for the article, such as 'emerging science'.

14. Adding Author Information 6:34

Choose the author from the list or add a new author using the plus button.

15. Including Teaser Text 7:05

Write the teaser text that will appear on the main page.

16. Adding Call to Action (CTA) Button 7:15

If applicable, add a CTA button text and URL.

17. Handling Resource Buttons 7:30

Add resource button text and URL if needed.

18. Creating Tables 8:02

Use predefined classes in Webflow for tables.
Generate table code using an LLM and paste it into the custom code area.

19. Previewing the Article 9:12

Check the article on the front end to ensure everything appears correctly.

20. Publishing the Article 10:06

Once all steps are completed and reviewed, publish the article.

Cautionary Notes

Ensure all images are properly optimized to avoid slow loading times.
Double-check all links and text for accuracy before publishing.

Tips for Efficiency

Use LLM tools for generating alt text and table code to save time.
Keep a checklist of common tasks to streamline the posting process.

Link to Loom

https://loom.com/share/a3358138da354fbbaee7a08ac5bd5738

‍

Inline Callout Box – Implementation Guide

Use this callout style to link readers to relevant CAS solutions without disrupting the reading flow. It's best for quick "learn more" moments mid-article.

When to Use

Linking to a single solution that's directly relevant to the paragraph above
Providing a subtle nudge without heavy visual emphasis
Mid-article callouts (for end-of-article, consider the Multi-Link Card style instead)

How to Add to a Blog Post in Webflow

Step 1: Add an Embed Element

In the Webflow Designer, open your blog post or Rich Text field
Click the + icon to add a new element
Select Embed (under Components)
Place it where you want the callout to appear

Step 2: Paste the Code

Copy and paste the following code into the embed:

<div class="callout-inline"> <p class="callout-inline__text"><strong>[YOUR BOLD TEXT]</strong> [YOUR SUPPORTING TEXT]</p> <a href="[YOUR-URL-PATH]" class="callout-inline__link"> [YOUR LINK TEXT] <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M9 5l7 7-7 7" /> </svg> </a> </div>

Step 3: Customize the Content

Replace the bracketed placeholders with your content:

PlaceholderWhat to EnterExample[YOUR BOLD TEXT]The hook or intro phraseNeed deeper patent insights?[YOUR SUPPORTING TEXT]Brief supporting contextCAS STNext provides comprehensive IP analysis tools.[YOUR LINK TEXT]The call-to-action textExplore STNext[YOUR-URL-PATH]The URL path (see below)/solutions/cas-stnext

Step 4: Set the URL Path

Important: Use only the path after cas.org — do not include the full URL.

✅ Correct: /solutions/cas-scifinder-discovery-platform/cas-scifinder

❌ Incorrect: https://www.cas.org/solutions/cas-scifinder-discovery-platform/cas-scifinder

This ensures links work correctly across staging and production environments.

Example

Before (template):

<p class="callout-inline__text"><strong>[YOUR BOLD TEXT]</strong> [YOUR SUPPORTING TEXT]</p> <a href="[YOUR-URL-PATH]" class="callout-inline__link"> [YOUR LINK TEXT]

After (filled in):

<p class="callout-inline__text"><strong>Working on synthesis planning?</strong> See how AI-powered retrosynthesis can cut your route-finding time.</p> <a href="/solutions/cas-scifinder-discovery-platform/cas-scifinder" class="callout-inline__link"> Explore CAS SciFinder

Writing Tips

Bold text: Frame as a question or statement that resonates with the reader's challenge
Supporting text: Keep it to one sentence; mention the solution name and key benefit
Link text: Use action verbs — "Explore," "See How," "Learn More About"
Placement: Position after a paragraph that naturally leads into the solution topic

Troubleshooting

Callout not displaying:

Make sure you saved and published the page
Check that the embed code wasn't accidentally modified

Fonts look different:

The callout inherits fonts from the site. If it looks off, check that the page is using the standard CAS template.

Link not working:

Verify you're using a relative path starting with /
Test the link by appending it to https://www.cas.org in your browser

Questions?

Contact the web team.

‍