ShipPress

Tutorials

Edit the footer by chatting

The footer is at the bottom of every page, so it is where visitors look for your address, opening hours, links and social accounts. In WordPress you would open the site editor, find the footer template part and rearrange its blocks one by one. In ShipPress you describe what the footer should have in the chat and the AI changes it for the whole site. In this tutorial I update the footer of Pier 7 Coffee.

  1. Look at your current footer

    Open your site in ShipPress and scroll the preview all the way down. Note what you want to change. The Pier 7 Coffee footer had the name, address, hours and a long Explore list of eleven links, but no short description of the business, no social links and no quick way back to the top of the page.

    The Pier 7 Coffee footer before the change: name, address and contact, bar and roasting hours, and one long Explore list.
    Before: one long list of links and no social links.

  2. Describe the new footer in one message

    Click + New Worker for a fresh chat and list every change in one message. Say that it is for every page, and ask it to keep the colors and fonts and leave everything else alone. I sent:

    Update the footer on every page: under the PIER 7 COFFEE logo add a one-line tagline 'Roasted on the harbor, poured at the bar.', add a Follow us column with Instagram and Facebook text links (use # as the link for now), split the long Explore list into two shorter columns, and add a 'Back to top' link on the right of the copyright line at the bottom. Keep the same colors and fonts. Don't change anything else.
    The ShipPress chat box with the message asking for a tagline, a Follow us column, two Explore columns and a Back to top link.
    List all footer changes in one message.

  3. Let the AI change it

    Press Enter. The AI first looks at how the footer is built, then edits it. Because the footer is shared, one change updates every page. You can follow the steps in the chat. For me it took about three minutes.

    The chat while the AI works, with a Worked step and a Running step.
    The AI reads the footer first, then edits it.

  4. Read what it did

    When it is done, the AI lists each change: the tagline under the name, the Explore list split into two columns of five or six links, the new Follow us column with links that point to # for now, and the Back to top link. It also says the footer now has six columns instead of four.

    The AI's summary with Tagline, Explore, Follow us and Back to top, plus suggestions like Link Instagram and Facebook.
    A short list of every change.

  5. Check it in the preview

    Scroll the preview down to the footer. Everything I asked for was there, but six columns were too many for this width: the name broke onto two lines and the email address ran into the next column. Always look at the result yourself, then ask for a fix.

    The first version of the new footer: six narrow columns, the name on two lines and the email touching the next column.
    First version: all there, but too tight.

  6. Fix the layout with a short follow-up

    Describe what looks wrong and how you want it. I sent:

    The footer columns are too tight now: the logo breaks onto two lines and the email runs into the next column. Put the logo and tagline on their own row at the top of the footer, with the other columns in one row below it and a bit more space between them.

    A minute or two later the name and tagline sat on their own row, and the address, hours, links and Follow us columns had room to breathe.

    The follow-up message about the tight columns and the AI's answer.
    Say what looks wrong and how it should look.
    Before and after the follow-up: six cramped columns, then the name and tagline on top with roomier columns below.
    First version on top, after the follow-up below.

  7. Check it on Phone

    Click Phone at the top right of the preview and scroll to the bottom. On a small screen the columns stack one under another with large links, and Back to top sits next to the copyright line.

    The new footer in the Phone preview: Explore links, Follow us with Instagram and Facebook, and Back to top.
    On a phone the columns stack.

  8. Add your real social links

    The Instagram and Facebook links still point to #. Before you go live, send the real addresses, for example: “Link Instagram to instagram.com/pier7coffee and Facebook to facebook.com/pier7coffee, and open them in a new tab.” You can also click the suggestion Link Instagram and Facebook under the answer.

    The finished footer on the computer preview: name and tagline on top, then address, hours, two Explore columns and Follow us.
    The finished footer, ready for your real links.

  9. Go back any time with History

    ShipPress saves a restore point after every AI turn. Click History at the top right to see one for the new footer and one for the layout fix. Click Restore next to either to go back to exactly how the site looked at that moment.

    ShipPress History with restore points for “Update the footer on every page” and “The footer columns are too tight now”.
    Each change is a restore point.

  10. Tips

    • Put the practical things in the footer: address, opening hours, phone or email and your social accounts.
    • Keep link lists short. Two columns of five links are easier to scan than one list of eleven.
    • If the footer looks crowded, ask for fewer columns or for the name on its own row.
    • Paste the real social links before you go live, so no link points to #.
    • Check the footer on Phone before you click Go live.