Read the full instructions in one continuous page. The illustrated guide adds screenshots and interactive task choices.
The Gator’s code is free. Downloads remain locked until your access request is approved. These guides are open to everyone.
Back up the complete field before editing. These instructions describe The Gator’s documented code destinations; exact widget and page-editor screenshots were not supplied. Confirm the matching field in your own dashboard.
FIELD GUIDE 01 · Homepage
Balance the homepage lead
Make the main story larger and place two smaller stories beside it. Begin by saving a copy of what already works.
Where to work: Appearance → Widgets / Widget Control Panel → existing SNO Text widget → Text/HTML
Allow: 25–45 min
What changed at The Gator
The Gator made its main story larger and placed two smaller stories beside it. Several attempts were needed to remove extra space and make the layout behave in different browsers.
Make the change
Open your SNO dashboard in one browser tab. Open your public homepage in a second tab. The dashboard is where you make changes; the public page is what readers see.
In the dashboard, move your pointer over Appearance. Click Design Backups. Click Create New Design Backup. Find the new backup, click its tag icon, type a name such as “Before homepage change — Oct. 24,” and press Enter.
Click Appearance → Widgets, or SNO Dashboard → Widget Control Panel. Find the existing text/code widget that controls the homepage design. A widget is one small content box on a page. If you cannot identify the correct widget, stop and ask your adviser or SNO Support.
Open that widget. Copy everything in its Text/HTML box into a plain-text file or your own saved-code file. Write down the widget’s title and location. This is your exact copy to put back if needed.
Open ChatGPT and start a new conversation. Paste the sample request from this guide’s “What to ask ChatGPT” tab into the message box. Add your complete current code and screenshots. Say: “I am a beginner. Tell me exactly what to click, and return one complete replacement that keeps my other features.” Send the request.
Before copying the answer, check that it names the same widget and says REPLACE or ADD TO. Replace means select everything in that one box and paste the complete new version. Add to means keep what is there and paste the new block at the bottom. If the answer is unclear, ask before pasting.
Click Copy on the code box in ChatGPT. Return to the correct SNO Text/HTML box. Follow the stated Replace/Add to instruction. Click Save in that widget. A code-only widget can look empty in the editor; check the public homepage.
Refresh the public homepage. You should see one large lead story on the left and two supporting stories on the right on a wide screen. Open the same page in Safari and Firefox, then narrow the window. Check that headlines, photos, and links still work. If the result is wrong, use “How to undo.”
Check the result
The main story is large, with two smaller stories beside it on a wide screen and a readable order on a phone.
Refresh the public page in another tab. You should see the change you requested.
Open every link or control affected by the change. They should still work.
Look in Safari and Firefox, then on a phone or a narrow browser window. Read the text and check the pictures.
Open a page you did not mean to change. It should still look right. Keep the saved original until you finish checking.
What to ask ChatGPT
I am a beginner using a SNO student news site. I want to make the homepage lead story larger with two supporting stories beside it.
Explain unfamiliar words. Tell me the exact menu, screen, and box to use. Say whether to ADD TO or REPLACE the existing contents. Keep everything unrelated to this change. Give me the complete code for the named field if a replacement is needed, followed by what I should see and how to undo it.
Here are my current code, screenshot, public URL, and browser name: [add them here].
How to undo
Open the same widget you edited. Paste back the complete original Text/HTML contents you saved before the change. Click Save in that widget.
Refresh the public page. Check that it matches the working version from before your edit. Do not keep adding fixes on top of an unclear problem.
If several widget or layout settings changed, use Appearance → Design Backups → your named earlier backup → Restore Design. That broader restore can also reset later design work, so keep a copy of the current state first.
Watch for: A code-only widget may look blank in the editor. Check the actual public page before deciding the change failed.
Make the short description under the main headline easier to read, without changing every other story.
Where to work: The existing homepage code widget, or Custom CSS if using plain CSS only
Allow: 10–15 min
What changed at The Gator
The Gator adjusted the short description below the main story so it had enough width and comfortable text spacing.
Make the change
Look at your public homepage. Find the short summary below the biggest headline. That short summary is the excerpt. Take a screenshot of it.
Create a named backup in Appearance → Design Backups. Copy the current homepage code widget and Custom CSS into your own saved notes before changing either.
In ChatGPT’s message box, describe the problem in everyday language: “This short summary is squeezed into too little space. Make only the main story’s summary easier to read.” Add the screenshot and your current code.
Ask ChatGPT to identify the exact place for its answer: the existing homepage widget, or SNO Design Options → Custom CSS. Ask it to keep the smaller supporting stories unchanged.
If the answer is plain CSS, open Appearance → SNO Design Options → Custom CSS. CSS is a set of appearance instructions. Paste it only as directed, without <style> tags. If the answer is a complete widget replacement, use that widget’s Text/HTML box instead.
Click the matching Save button. Refresh the public homepage. You should see a wider, readable summary under the main story, while other summaries keep their usual size.
Try another story in the main position when you are ready. The appearance should follow the position, not stay attached to one particular article.
Check the result
The main summary has comfortable width; the smaller story cards and their text keep their intended size.
Refresh the public page in another tab. You should see the change you requested.
Open every link or control affected by the change. They should still work.
Look in Safari and Firefox, then on a phone or a narrow browser window. Read the text and check the pictures.
Open a page you did not mean to change. It should still look right. Keep the saved original until you finish checking.
What to ask ChatGPT
I am a beginner using a SNO student news site. I want to make the main story summary easier to read.
Explain unfamiliar words. Tell me the exact menu, screen, and box to use. Say whether to ADD TO or REPLACE the existing contents. Keep everything unrelated to this change. Give me the complete code for the named field if a replacement is needed, followed by what I should see and how to undo it.
Here are my current code, screenshot, public URL, and browser name: [add them here].
How to undo
Return to the exact code field you edited. Paste back its complete saved original contents and click its Save button.
Refresh the public page. Check that it matches the working version from before your edit. Do not keep adding fixes on top of an unclear problem.
If several widget or layout settings changed, use Appearance → Design Backups → your named earlier backup → Restore Design. That broader restore can also reset later design work, so keep a copy of the current state first.
Watch for: Make the appearance follow the main-story position, so the next lead story receives the same treatment.
Line up the News and Opinion sections so their photos, headlines, and View All buttons look tidy.
Where to work: Appearance → SNO Design Options → Custom CSS
Allow: 20–35 min
What changed at The Gator
The Gator lined up section photos and buttons. Separate section pages needed their own instructions so a News-page change did not disturb the homepage.
Make the change
Open the page you want to improve and take a screenshot. Decide whether you mean the homepage’s News/Opinion boxes or a separate section page such as News. Say which one in your request.
Create a named Design Backup. Open Appearance → SNO Design Options → Custom CSS. Copy everything already in that box into a plain-text file before editing.
Start a ChatGPT conversation. In the message box, write what should line up: “The News and Opinion photos should start at the same height, and their View All buttons should line up.” Attach the screenshot and complete current CSS.
Ask for a change limited to those sections. Explain what must stay the same: homepage lead, Features, Multimedia, and other sections. If you do not know the section’s code name, ask how to find it; do not guess a number from The Gator’s site.
Ask ChatGPT whether to add its code at the bottom or replace a specifically named old block. Keep all other CSS. Do not replace the entire box unless you have a complete replacement that includes your existing rules.
Copy the code. Paste it in Custom CSS as instructed, without <style> tags. Save the design settings.
Refresh the public page. You should see aligned photos and buttons. Also open an article, Features, and Multimedia to check that the change stayed in the intended area.
Check the result
The paired section headings, photo frames, and View All controls line up, even with different headline lengths.
Refresh the public page in another tab. You should see the change you requested.
Open every link or control affected by the change. They should still work.
Look in Safari and Firefox, then on a phone or a narrow browser window. Read the text and check the pictures.
Open a page you did not mean to change. It should still look right. Keep the saved original until you finish checking.
What to ask ChatGPT
I am a beginner using a SNO student news site. I want to line up the News and Opinion photos and buttons.
Explain unfamiliar words. Tell me the exact menu, screen, and box to use. Say whether to ADD TO or REPLACE the existing contents. Keep everything unrelated to this change. Give me the complete code for the named field if a replacement is needed, followed by what I should see and how to undo it.
Here are my current code, screenshot, public URL, and browser name: [add them here].
How to undo
Return to the exact code field you edited. Paste back its complete saved original contents and click its Save button.
Refresh the public page. Check that it matches the working version from before your edit. Do not keep adding fixes on top of an unclear problem.
If several widget or layout settings changed, use Appearance → Design Backups → your named earlier backup → Restore Design. That broader restore can also reset later design work, so keep a copy of the current state first.
Watch for: Ask for a change to the exact page you mean: the homepage pair and an inside News page are different layouts.
Source: September 15–27 layout conversations; numeric IDs are historical Gator-specific values.
Choose whether a photo should fill a box or stay completely visible. Check faces and words before saving.
Where to work: Custom CSS; focal-point behavior in the existing homepage code widget
Allow: 15–25 min
What changed at The Gator
The Gator used consistent photo frames, moved some crops upward to protect faces, and kept text-heavy graphics and podcast covers fully visible.
Make the change
Look at the picture you want to change. Is it a photograph, or artwork containing words, such as a podcast cover? Take a screenshot and keep a copy of the original picture.
Create a Design Backup and save the current code from the field you will change.
Open ChatGPT. Paste your request in its message box and attach the screenshot. Say either “Fill the picture box, but keep the faces visible” or “Show this whole graphic so none of its words are cut off.”
Ask ChatGPT to name the exact code field and keep the change limited to this part of your site. Ask it to explain “cover” and “contain” if those words appear: cover fills the box and may cut off edges; contain keeps the whole image visible.
Copy the returned code into the field ChatGPT identified. Follow its Add to/Replace instruction and save that field.
Refresh the public page. You should see natural proportions, readable words, and complete faces. Check a wide photo and a tall photo. If a face is still clipped, send a screenshot back and ask to move the visible crop upward.
Open the page on a phone or narrow the browser window. Artwork should still be readable. A browser’s automatic face detection is optional and may not be available.
Check the result
Faces and words remain visible, and each image keeps its natural proportions.
Refresh the public page in another tab. You should see the change you requested.
Open every link or control affected by the change. They should still work.
Look in Safari and Firefox, then on a phone or a narrow browser window. Read the text and check the pictures.
Open a page you did not mean to change. It should still look right. Keep the saved original until you finish checking.
What to ask ChatGPT
I am a beginner using a SNO student news site. I want to keep faces and words visible in pictures.
Explain unfamiliar words. Tell me the exact menu, screen, and box to use. Say whether to ADD TO or REPLACE the existing contents. Keep everything unrelated to this change. Give me the complete code for the named field if a replacement is needed, followed by what I should see and how to undo it.
Here are my current code, screenshot, public URL, and browser name: [add them here].
How to undo
Return to the exact code field you edited. Paste back its complete saved original contents and click its Save button.
Refresh the public page. Check that it matches the working version from before your edit. Do not keep adding fixes on top of an unclear problem.
If several widget or layout settings changed, use Appearance → Design Backups → your named earlier backup → Restore Design. That broader restore can also reset later design work, so keep a copy of the current state first.
Watch for: A frame that fills its space can crop image edges. Use the whole image for artwork whose words must stay visible.
Source: September 27 thumbnail work + recovered October 23 smartPhotos code.
Add small labels such as Photo Gallery or In-Depth Feature so readers know what kind of story they are opening.
Where to work: Existing automatic-feature SNO Text widget → Text/HTML
Allow: 20–30 min
What changed at The Gator
Small labels helped distinguish podcasts, photo galleries, illustrations, editorials, and in-depth reporting. The labels were tied to the right story groups.
Make the change
On The Gator’s screenshot, notice the small words above some headlines: GATOR PODCASTS, PHOTO GALLERY, ILLUSTRATION, or IN-DEPTH FEATURE. These are labels, not new articles.
Create a Design Backup. Copy the entire existing automatic-feature code widget into your own saved-code file before editing it. This widget may control several features at once.
Open the story in WordPress. Find Categories and check the intended category. A category is a group of stories, like Podcasts. Save or update the story. A category-based label needs the correct category assignment.
Check that the story already appears in the homepage story widget you want. A label does not make the story appear there by itself; the widget’s story choices still control that.
In ChatGPT, describe the label you want and paste the complete current code. Ask for a complete replacement of that existing code widget that preserves the other labels and author information.
Ask it to verify the category numbers for your own publication. The Gator’s category numbers will not necessarily work on another school’s site.
Copy the complete answer into the same widget’s Text/HTML box as directed. Save the widget. Refresh the public page: only stories in the intended group should receive that label.
Check the result
Only stories with the intended category or tag receive the matching format label.
Refresh the public page in another tab. You should see the change you requested.
Open every link or control affected by the change. They should still work.
Look in Safari and Firefox, then on a phone or a narrow browser window. Read the text and check the pictures.
Open a page you did not mean to change. It should still look right. Keep the saved original until you finish checking.
What to ask ChatGPT
I am a beginner using a SNO student news site. I want to add clear labels to the right stories.
Explain unfamiliar words. Tell me the exact menu, screen, and box to use. Say whether to ADD TO or REPLACE the existing contents. Keep everything unrelated to this change. Give me the complete code for the named field if a replacement is needed, followed by what I should see and how to undo it.
Here are my current code, screenshot, public URL, and browser name: [add them here].
How to undo
Open the same widget you edited. Paste back the complete original Text/HTML contents you saved before the change. Click Save in that widget.
Refresh the public page. Check that it matches the working version from before your edit. Do not keep adding fixes on top of an unclear problem.
If several widget or layout settings changed, use Appearance → Design Backups → your named earlier backup → Restore Design. That broader restore can also reset later design work, so keep a copy of the current state first.
Watch for: The newsroom assigns categories and tags. A label alone does not choose which stories appear on the homepage.
Source: Recovered October 23 combined homepage widget.
Keep the Features stories and the neighboring photo area aligned, with smaller older stories below.
Where to work: Existing Features layout widget or Custom CSS, according to the code package
Allow: 25–40 min
What changed at The Gator
The Gator worked to line up feature photos and neighboring photo content, with smaller older stories below the main items.
Make the change
Open the Features area on your public site. Take a screenshot and describe what looks wrong: uneven photo tops, oversized older stories, or a photo column that drops too low.
Create a named Design Backup. Save copies of both the current Features code widget and the Custom CSS box.
Paste your description into ChatGPT’s message box. Add the screenshot and full current code. Say: “Keep every real story and every link. Change the layout only.”
Ask for the exact destination. A combined widget answer belongs in the named Text/HTML widget; a plain CSS answer belongs in Custom CSS. Do not put the same fix in both places.
If ChatGPT says a story is inside another story because of broken HTML, ask it to repair the structure rather than simply hide those stories. HTML describes how the content is arranged.
Copy the answer into the named field, following Add to/Replace directions. Click Save.
Refresh the public page. You should see aligned top photos, readable older-story cards, and a working View All link. Count the stories and open their links to make sure none disappeared.
Check the result
The expected stories remain visible, the photos align, and every story link and View All control works.
Refresh the public page in another tab. You should see the change you requested.
Open every link or control affected by the change. They should still work.
Look in Safari and Firefox, then on a phone or a narrow browser window. Read the text and check the pictures.
Open a page you did not mean to change. It should still look right. Keep the saved original until you finish checking.
What to ask ChatGPT
I am a beginner using a SNO student news site. I want to line up the Features stories and neighboring photos.
Explain unfamiliar words. Tell me the exact menu, screen, and box to use. Say whether to ADD TO or REPLACE the existing contents. Keep everything unrelated to this change. Give me the complete code for the named field if a replacement is needed, followed by what I should see and how to undo it.
Here are my current code, screenshot, public URL, and browser name: [add them here].
How to undo
Open the same widget you edited. Paste back the complete original Text/HTML contents you saved before the change. Click Save in that widget.
Refresh the public page. Check that it matches the working version from before your edit. Do not keep adding fixes on top of an unclear problem.
If several widget or layout settings changed, use Appearance → Design Backups → your named earlier backup → Restore Design. That broader restore can also reset later design work, so keep a copy of the current state first.
Watch for: Count the stories after the change. If one disappears, ask for the structure to be repaired rather than hiding more content.
Source: September 24 conversations + uploaded Features flush-grid package.
Place a graphic and a highlighted quotation inside an article while keeping the student’s reporting intact.
Where to work: Posts → selected story → Text/HTML editing view; isolated CSS scoped to that article
Allow: 20–35 min
What changed at The Gator
The solar-panel article combined the original reporting with a side graphic, a highlighted quote, and a note explaining what an electricity estimate meant.
Make the change
Open Posts in WordPress and choose the article. Copy the full article content before editing. A saved post revision is an earlier version of that article you can return to.
Upload the graphic to Media if needed. Open it in Media and copy its File URL. This is the public image address; the address ending in wp-admin/upload.php is an editing screen, not the image itself.
Open ChatGPT. In its message box, paste your article’s current HTML and describe the layout. Example: “Keep all the reporting. Put the graphic on the right, let text flow beside it, and make it stack above the text on a phone.” Add a screenshot.
For a highlighted quote, supply a real quotation, the source’s name, and any approved photo or profile link. Ask ChatGPT to preserve the quotation exactly. Do not ask it to invent reporting.
Ask for HTML for this existing article only. Ask it to keep the homepage layout unchanged and explain how to open your editor’s Text/HTML editing view. Use the editor labels in your SNO dashboard.
Copy the answer into the article’s correct HTML editing area. Use Preview before Update. You should see the original story text, a readable graphic, its credit, and the attributed quote.
Check the public homepage’s short summary too. Use plain editorial text in the story excerpt, so code does not appear as a teaser. If the graphic uses an estimate, add a plain-language note explaining what the number means.
Check the result
The complete reporting, graphic credit, and accurately attributed quotation remain visible; the homepage summary contains plain text.
Refresh the public page in another tab. You should see the change you requested.
Open every link or control affected by the change. They should still work.
Look in Safari and Firefox, then on a phone or a narrow browser window. Read the text and check the pictures.
Open a page you did not mean to change. It should still look right. Keep the saved original until you finish checking.
What to ask ChatGPT
I am a beginner using a SNO student news site. I want to add a graphic and a verified highlighted quote inside an article.
Explain unfamiliar words. Tell me the exact menu, screen, and box to use. Say whether to ADD TO or REPLACE the existing contents. Keep everything unrelated to this change. Give me the complete code for the named field if a replacement is needed, followed by what I should see and how to undo it.
Here are my current code, screenshot, public URL, and browser name: [add them here].
How to undo
Open the same article or page in WordPress. Use its Revisions option to choose the saved version from before the change, or paste back the complete original HTML you copied.
Preview the restored article/page. If correct, save or update it. Also check the public homepage summary.
If you changed a separate CSS field too, restore that saved field. A Design Backup does not restore article text or deleted pictures.
Watch for: Keep the work inside the chosen article. Check its Preview before Update, then inspect the homepage summary too.
Adapt the current Meet the Staff page while preserving biography links and real recent work.
Where to work: Pages → Meet the Staff → page Text/HTML content
Allow: 45–90 min
What changed at The Gator
The Gator worked on a staff directory that kept student biographies accessible while improving the presentation of names, roles, photos, and reporting.
Make the change
Open the current Meet the Staff page and identify the role groups, biography links, recent-work links, and year selector you want to preserve.
In SNO, open Pages and select Meet the Staff. Save the complete current page content in a plain-text file before editing; retain a page revision and a named Design Backup.
Use the matching current staff HTML, staff CSS, and staff JavaScript files from the shared staff package. They are parts of one page-content implementation.
Ask ChatGPT for one adapted page-content replacement, keeping the required <style> and <script> tags. Supply your own SNO staff profiles, role order, page URL, and current content. Keep the fallback directory link.
Use the page’s Text/HTML editing view for the combined content. Keep unrelated site CSS and widgets intact. Preview, then Update the page.
Test every biography and recent-work link, the year selector, loading/fallback text, keyboard use, and a narrow screen.
Check the result
Each person has an accurate name and role, a working biography link, and real recent headlines or a clear empty state.
Refresh the public page in another tab. You should see the change you requested.
Open every link or control affected by the change. They should still work.
Look in Safari and Firefox, then on a phone or a narrow browser window. Read the text and check the pictures.
Open a page you did not mean to change. It should still look right. Keep the saved original until you finish checking.
What to ask ChatGPT
I am a beginner using a SNO student news site. I want to improve the staff page while keeping all biography links.
Explain unfamiliar words. Tell me the exact menu, screen, and box to use. Say whether to ADD TO or REPLACE the existing contents. Keep everything unrelated to this change. Give me the complete code for the named field if a replacement is needed, followed by what I should see and how to undo it.
Here are my current code, screenshot, public URL, and browser name: [add them here].
How to undo
Open Pages → Meet the Staff. Restore the complete saved page content or the appropriate page revision, Preview, then Update.
Refresh the public staff page. Check the original layout, biography links, recent-work links, and year selector.
Keep the page’s matching HTML, CSS, and inline JavaScript together. Restore a separate field only if you actually changed that field.
Watch for: Use the code for your current staff page. Keep biography links usable while recent headlines load.
Source: Current Gator staff-page export captured October 24; live source checked October 25, 2026. HTML, style, and inline script are within the Meet the Staff page body.
Choose one task: full podcast artwork, readable video titles, or usable gallery controls.
Where to work: Appearance → SNO Design Options → Custom CSS · choose one appearance change below
Allow: 20–35 min · small appearance edit
What changed at The Gator
The Gator adjusted video titles, photo galleries, and podcast covers so readers could recognize and use each format.
Make the change
Open your public Multimedia page. Take a screenshot. Point out one change you want, such as “Keep the whole podcast cover visible” or “Put video titles below the image.”
Create a named Design Backup. Copy the complete current Custom CSS into saved notes.
Paste your description into ChatGPT’s message box, followed by the relevant complete code. Attach the screenshot. Say which pages should stay unchanged.
Ask for an answer that names the exact field. Use Custom CSS for a confirmed scoped appearance change. Preserve the existing gallery engine and controls; the supplied Gator examples do not establish a separate gallery-script installation field.
Copy the answer into that field as directed and save. Keep the original code copy.
Refresh the public Multimedia page. You should see complete podcast artwork, readable titles, and working gallery/video controls. Also check the homepage and a phone-sized window.
Check the result
Podcast covers stay complete, titles are readable, and video/gallery controls work on the intended page.
Refresh the public page in another tab. You should see the change you requested.
Open every link or control affected by the change. They should still work.
Look in Safari and Firefox, then on a phone or a narrow browser window. Read the text and check the pictures.
Open a page you did not mean to change. It should still look right. Keep the saved original until you finish checking.
What to ask ChatGPT
I am a beginner using a SNO student news site. I want to make video titles and podcast covers easier to read.
Explain unfamiliar words. Tell me the exact menu, screen, and box to use. Say whether to ADD TO or REPLACE the existing contents. Keep everything unrelated to this change. Give me the complete code for the named field if a replacement is needed, followed by what I should see and how to undo it.
Here are my current code, screenshot, public URL, and browser name: [add them here].
How to undo
Return to the exact code field you edited. Paste back its complete saved original contents and click its Save button.
Refresh the public page. Check that it matches the working version from before your edit. Do not keep adding fixes on top of an unclear problem.
If several widget or layout settings changed, use Appearance → Design Backups → your named earlier backup → Restore Design. That broader restore can also reset later design work, so keep a copy of the current state first.
Watch for: Say whether you mean the homepage media strip or the separate Multimedia page; each needs its own instructions.
Source: September 20–24 multimedia and gallery conversations.
Revise an existing About page: a clear mission, readable policy sections, and working contact routes. Preserve the approved words.
Where to work: Pages → About → HTML/code view; CSS scoped to the About wrapper
Allow: 15–25 min
What changed at The Gator
The Gator made its mission and policies easier to find, using clear section links and spacing that kept the text from overlapping.
Make the change
Open the public About page and take a screenshot. In WordPress, open Pages → All Pages → About. Copy the complete page HTML and save a named page revision before editing.
In ChatGPT’s message box, paste the example prompt from this module. Attach your existing page HTML and screenshots. Explain that this is an existing SNO page and that all approved policy wording, links, and form code must remain.
Ask for one complete replacement for this page’s content only. Require a unique wrapper so its styles cannot change the homepage or other articles. Ask ChatGPT to identify the page’s Text/HTML editing view before you paste.
Use the actual Gator examples here: a distinct Mission Statement panel and separate policy topics with clear headings. Section-jump buttons are an optional addition; the current screenshots do not show them.
Paste only into the named About-page content field. Preview before clicking Update. Check that every mission point and policy paragraph remains, headings are in order, and the form is still present.
Test each contact and policy link, keyboard navigation, and a narrow browser window. If you add jump links, test every destination. Save only after these checks; use the page revision or saved HTML to undo.
Check the result
All approved policy wording remains, the mission is readable, and each section/contact link reaches its destination.
Refresh the public page in another tab. You should see the change you requested.
Open every link or control affected by the change. They should still work.
Look in Safari and Firefox, then on a phone or a narrow browser window. Read the text and check the pictures.
Open a page you did not mean to change. It should still look right. Keep the saved original until you finish checking.
What to ask ChatGPT
I am new to coding and want to revise our existing SNO About page. Keep every approved word, school link, credit, and contact-form shortcode unchanged. Give the mission a distinct panel and group each policy under a clear heading. Add section-jump links only if they help. Scope all styling to this one page. Ask me for the complete current HTML and a screenshot. Return one complete replacement for the named page-content field, tell me exactly which editor view to use, explain how to preview and check it, and give the steps to restore the original. Do not invent newsroom policy.
How to undo
Open the same article or page in WordPress. Use its Revisions option to choose the saved version from before the change, or paste back the complete original HTML you copied.
Preview the restored article/page. If correct, save or update it. Also check the public homepage summary.
If you changed a separate CSS field too, restore that saved field. A Design Backup does not restore article text or deleted pictures.
Watch for: A visual change should preserve the editors’ approved wording and the existing contact form.
Source: October 22 About-page conversation and recovered About-page repair context.
Use the actual SNO CSS, widget, or page field that owns your change.
Where to work: Custom CSS; SNO Text widget Text/HTML; or selected page Text/HTML content
Allow: 10–20 min
What changed at The Gator
Different changes needed different SNO boxes. Knowing where to paste was just as important as the code itself.
Make the change
Identify whether the supplied package is plain CSS, a combined HTML widget, or combined page content. Save the whole original field.
For plain CSS, use Appearance → SNO Design Options → Custom CSS without <style> tags.
For a widget package, open the named existing SNO Text widget. Paste into Text/HTML with the required package tags.
For the current staff-page implementation, keep the HTML, CSS, and inline script together in the Meet the Staff page’s Text/HTML content.
Use Site Designer for supported layout settings. Match a code package to its actual page or widget instead of treating a gear icon as a script field.
Save or Update the same field and test the public page, links, controls, and a narrow screen.
Check the result
Each block went into its named field with the correct tags and Add/Replace instruction.
Refresh the public page in another tab. You should see the change you requested.
Open every link or control affected by the change. They should still work.
Look in Safari and Firefox, then on a phone or a narrow browser window. Read the text and check the pictures.
Open a page you did not mean to change. It should still look right. Keep the saved original until you finish checking.
What to ask ChatGPT
I am a beginner using a SNO student news site. I want to understand exactly where to paste this code.
Explain unfamiliar words. Tell me the exact menu, screen, and box to use. Say whether to ADD TO or REPLACE the existing contents. Keep everything unrelated to this change. Give me the complete code for the named field if a replacement is needed, followed by what I should see and how to undo it.
Here are my current code, screenshot, public URL, and browser name: [add them here].
How to undo
Return to the exact code field you edited. Paste back its complete saved original contents and click its Save button.
Refresh the public page. Check that it matches the working version from before your edit. Do not keep adding fixes on top of an unclear problem.
If several widget or layout settings changed, use Appearance → Design Backups → your named earlier backup → Restore Design. That broader restore can also reset later design work, so keep a copy of the current state first.
Watch for: Use Custom CSS for plain CSS, the existing SNO Text widget’s Text/HTML for a widget package, or the named page’s content for a page package. The Site Designer gear is a layout control.
Source: Supplied Gator widget packages, Custom CSS screenshot, and current staff-page source.
If something looks wrong, put the saved version back. Choose the undo method that matches what you changed.
Where to work: The field you edited; Appearance → Design Backups; SNO Design Options → Revision History
Allow: 5–15 min
What changed at The Gator
The Gator’s working sessions showed why every experiment needs a saved starting point. Different restore tools undo different types of changes.
Make the change
Before any experiment, open Appearance → Design Backups. Click Create New Design Backup. On the new backup, click the tag icon, type a clear name and date, and press Enter. Also copy the exact code field you will edit into a plain-text file or your own saved-code file.
If one code edit fails, go back to that same field. Paste back the complete saved original. Click Save. Refresh the public page. Start with this small undo before restoring a whole design.
For combined widget or page code, restore the complete saved contents in the same Text/HTML field. Save the widget or Update the page, then reload the public page.
If Site Designer’s gear stops working, disable or restore your newest custom code in its original field. Open a fresh dashboard tab. Avoid adding more fixes while you are unsure what caused the problem.
If the page layout or several widgets are wrong, open Appearance → Design Backups. Find the backup from before the change. Click Restore Design. This restores the saved widget setup and design settings together; later design changes may also be reset.
If you changed only design settings, open SNO Design Options → Revision History. Find the desired earlier timestamp and click Restore. This does not restore widget contents or widget arrangements.
If the problem is inside one article or page, use that post/page’s WordPress Revisions. Design Backups do not recover deleted stories, photos, or categories. Ask SNO Support if you need deleted content restored.
Check the public homepage, the changed page, and a phone-sized view. Record which backup you used. Once everything works again, make a new named checkpoint.
Check the result
The restored public page matches the version that worked, including its affected links and controls.
Refresh the public page in another tab. You should see the change you requested.
Open every link or control affected by the change. They should still work.
Look in Safari and Firefox, then on a phone or a narrow browser window. Read the text and check the pictures.
Open a page you did not mean to change. It should still look right. Keep the saved original until you finish checking.
What to ask ChatGPT
I am a beginner using a SNO student news site. I want to undo the last change and return to the saved working version.
Explain unfamiliar words. Tell me the exact menu, screen, and box to use. Say whether to ADD TO or REPLACE the existing contents. Keep everything unrelated to this change. Give me the complete code for the named field if a replacement is needed, followed by what I should see and how to undo it.
Here are my current code, screenshot, public URL, and browser name: [add them here].
How to undo
Return to the exact code field you edited. Paste back its complete saved original contents and click its Save button.
Refresh the public page. Check that it matches the working version from before your edit. Do not keep adding fixes on top of an unclear problem.
If several widget or layout settings changed, use Appearance → Design Backups → your named earlier backup → Restore Design. That broader restore can also reset later design work, so keep a copy of the current state first.
Watch for: Restoring a full Design Backup can also reset later good layout changes. Start with the smallest undo that matches your edit.
Source: Current SNO Design Backups & Revision History documentation, checked October 24, 2026.
When nothing changes—or the wrong thing changes—check the location, the Save button, and the original copy before trying another fix.
Where to work: Public page + the original code field
Allow: 10–20 min
What changed at The Gator
Some answers did not work on the first attempt. Clear screenshots, the exact editing location, and a saved original made the next attempt easier to diagnose.
Make the change
Check that you clicked Save in the actual widget or design settings. Then refresh the public page. The public page is the website readers visit, not the box you edit in WordPress.
Read the code’s placement instructions again. Did you paste CSS into Custom CSS, or a complete HTML package into Text/HTML? Did you accidentally paste the explanation or the three backtick marks around a code block?
Check Add to versus Replace. If you added a second copy of an old fix, return to your saved original before testing again. Two competing versions can cancel each other out.
Open the public page in another browser or a private window. Wait for its pictures to load. If it works in one browser but not another, write down both browser names.
Take a screenshot of what is wrong. In ChatGPT’s message box, describe the expected result, the actual result, and exactly where you pasted the code. Include the full current code.
Ask ChatGPT: “Explain the likely problem before giving me another patch. What is the smallest thing I can check?” A code selector is the address of the part being changed; the address must match your own site.
If two attempts fail, stop and put the saved working copy back. Ask for help diagnosing the cause before adding more code. You should return to a page that works before starting a different approach.
Check the result
After restoring the saved field, the public page works again before you try a different fix.
Refresh the public page in another tab. You should see the change you requested.
Open every link or control affected by the change. They should still work.
Look in Safari and Firefox, then on a phone or a narrow browser window. Read the text and check the pictures.
Open a page you did not mean to change. It should still look right. Keep the saved original until you finish checking.
What to ask ChatGPT
I am a beginner using a SNO student news site. I want to understand why my last code change did not work.
Explain unfamiliar words. Tell me the exact menu, screen, and box to use. Say whether to ADD TO or REPLACE the existing contents. Keep everything unrelated to this change. Give me the complete code for the named field if a replacement is needed, followed by what I should see and how to undo it.
Here are my current code, screenshot, public URL, and browser name: [add them here].
How to undo
Return to the exact code field you edited. Paste back its complete saved original contents and click its Save button.
Refresh the public page. Check that it matches the working version from before your edit. Do not keep adding fixes on top of an unclear problem.
If several widget or layout settings changed, use Appearance → Design Backups → your named earlier backup → Restore Design. That broader restore can also reset later design work, so keep a copy of the current state first.
Watch for: After two failed attempts, return to the saved working version and ask ChatGPT to diagnose the cause from your code and screenshots.
Source: September–October failed-patch conversations and October 23 browser troubleshooting.