Your Complete Guide to Editing Your Code Camo Website
Robert Hole • August 5, 2026

Your Complete Guide to Editing Your Code Camo Website

Your website is live — but that doesn't mean it's frozen. You have full access to a powerful website editor where you can update text, swap out images, add new pages, rearrange sections, manage your blog, and a whole lot more. All without writing a single line of code.

This guide walks you through everything the editor can do, step by step, in plain English. It's long because the editor is capable — but you don't have to read it all at once. Use the jump links below to go straight to what you need.

Bookmark this page. You'll come back to it.

Jump To A Section

Section 1: Logging In and Opening the Editor

Everything starts with getting into the editor. Here's how to get there from scratch.

Step 1: Log Into Your Dashboard

  1. Go to manage.codecamo.com
  2. Enter your email address and password
  3. Click Log In

Step 2: Open the Editor

  1. Once logged in, you'll see your website listed on the dashboard
  2. Hover over your site — a set of icons will appear
  3. Click the Edit icon (it looks like a pencil)
  4. The editor will open in a new tab, loading your live website in edit mode

The first time the editor loads, it may take a few seconds. Once it's open, you're in — and everything from here on covers what you can do inside it.

Forgot Your Password?

  1. On the login page, click Forgot Password
  2. Enter your email and follow the reset link sent to your inbox

↑ Back to Top

Section 2: Understanding the Editor Layout

Before you start clicking things, it helps to know where everything is. The editor has four main areas. Think of it like a cockpit — once you know what each instrument does, flying gets a lot easier.

The Top Navigation Bar

The bar that runs across the very top of the editor. From left to right, here's what's in it:

  • Hamburger Menu (☰) — the three-line icon on the far left. Opens a menu with access to settings, support resources, and more.
  • Page Dropdown — shows which page you're currently editing. Click it to switch to a different page.
  • Device Icons — three icons representing desktop, tablet, and mobile. Click any of them to preview and edit how your site looks on that screen size.
  • Undo / Redo buttons — step backwards or forwards through your recent changes.
  • Save Indicator — a checkmark icon that shows whether your latest changes have been saved.
  • Preview button — opens a live preview of your site including any unpublished changes.
  • Publish / Republish button — makes your changes live on your actual website.
  • Home icon — takes you back to your dashboard without closing the editor tab.

The Side Panel (Left)

This is where most of the editor's tools live. The side panel has several tabs:

  • Add — drag and drop widgets, images, and text onto your page
  • Pages — add, view, and manage all the pages on your site
  • Layers — see a hierarchical list of every element on the current page
  • Theme — control site-wide design settings like colors and fonts
  • More — access Blog, Settings, and other features

The Canvas (Center)

This is the main editing area — the visual representation of your website. You click directly on elements here to select and edit them. What you see here is very close to what visitors see on your live site.

The Design Panel (Right)

When you click on any element on the canvas, a design panel opens on the right side. This is where you adjust things like spacing, colors, borders, shadows, and animation for that specific element.

↑ Back to Top

Section 3: Switching Between Pages

Your website has multiple pages — home, about, services, contact, and possibly more. Here's how to navigate between them inside the editor.

Using the Page Dropdown

  1. In the top navigation bar, find the current page name (usually shown in the center of the bar)
  2. Click the dropdown arrow next to it
  3. A list of all your pages will appear
  4. Click any page name to navigate to it — the canvas will update to show that page

Using the Side Panel

  1. In the left side panel, click Pages
  2. Your full page list will appear
  3. Click any page to open it for editing

You can have multiple browser tabs open with the editor if you want to work on different pages side by side — just duplicate the tab and navigate to a different page in each one.

↑ Back to Top

Section 4: Previewing Your Site (Desktop, Tablet, Mobile)

Your website automatically adjusts its layout depending on what device a visitor is using. The editor lets you preview and edit each of those views separately.

Switching Between Device Views

  1. In the top navigation bar, look for the device icons — they look like a monitor, a tablet, and a phone
  2. Click any icon to switch to that device's view
  3. The canvas will update to show how your site looks on that screen size

You can make edits in any device view. Changes made in desktop view usually carry over to tablet and mobile automatically, but you can also make device-specific adjustments if something looks off on a particular screen size.

Full Site Preview

  1. Click the Preview button in the top navigation bar
  2. A new browser tab will open showing your site exactly as visitors will see it — including any changes you've made but haven't published yet
  3. Use this to double-check your work before hitting Publish

Tip: Always preview on mobile before publishing. More than half of your visitors are probably on a phone — make sure things look right there too.

↑ Back to Top

Section 5: Editing Text

Updating the words on your website is one of the most common edits you'll make. Here's everything you can do with text.

How to Edit Text

  1. Click directly on any text on the canvas to select it
  2. Double-click to enter edit mode — a cursor will appear inside the text
  3. Select text by clicking and dragging, or use Ctrl+A (Cmd+A on Mac) to select all text in that block
  4. Type your new text, or paste it in
  5. Click anywhere outside the text block when you're done

Text Formatting Options

When you select text, a small formatting toolbar appears above it. Here's what each option does:

  • Bold — makes selected text bold
  • Italic — italicizes selected text
  • Underline — underlines selected text
  • Strikethrough — puts a line through selected text
  • Text Color — changes the color of selected text
  • Font — change the font family for selected text
  • Font Size — increase or decrease the size
  • Heading Style — set text as H1, H2, H3, H4, H5, H6, or paragraph. Use headings to create hierarchy — H1 is the biggest/most important, H6 is smallest
  • Alignment — left, center, right, or justify
  • Bullet List — creates an unordered (bulleted) list
  • Numbered List — creates an ordered (numbered) list
  • Link — turns selected text into a clickable hyperlink (to another page, an external URL, an email address, or a phone number)
  • All Caps — converts selected text to uppercase
  • Letter Spacing — adds space between individual characters
  • Line Height — adjusts the vertical space between lines of text

Adding a Link to Text

  1. Select the text you want to turn into a link
  2. Click the Link icon in the toolbar
  3. Choose the link type: Page (another page on your site), URL (external website), Email, or Phone
  4. Enter the destination and click Done

Pasting Text From Outside the Editor

When pasting text from Word, Google Docs, or another source, the editor will apply your site's existing text styles automatically — so you don't end up with mismatched fonts or sizes. Bold, italic, and underline formatting from the original source will be preserved.

Clearing Text Formatting

If text looks wrong after pasting or editing, you can strip all custom formatting and reset it to your site's default style:

  1. Select the text
  2. Click the three-dots icon (•••) in the formatting toolbar
  3. Click Clear Format

↑ Back to Top

Section 6: Working With Images

Images make your website. Here's how to swap them out, edit them, and keep them looking sharp.

Replacing an Image

  1. Click on any image on the canvas to select it
  2. A small toolbar will appear — click Change Image or the image icon
  3. The image picker will open — choose from your uploaded images, free stock photos from Unsplash, or upload a new image from your device
  4. Select your image and click Done

Uploading a New Image

  1. In the image picker, click Upload
  2. Select an image file from your computer (JPG, PNG, GIF, and WebP are all supported)
  3. The image will upload and be ready to use

Finding Free Stock Images

If you don't have a photo, the editor connects directly to Unsplash — a library of high-quality, royalty-free photos.

  1. In the image picker, click the Unsplash tab
  2. Search for a keyword (e.g., "construction," "veteran," "small business")
  3. Browse the results and click the one you want
  4. Click Done to place it

Adjusting Image Position

When an image is placed in a container, you can control which part of the image is shown (especially useful for portrait photos placed in landscape-shaped containers).

  1. Click the image to select it
  2. Click Adjust Position or look for the position option in the image toolbar
  3. Drag the focal point to center on the part of the image you want to show
  4. Click Done

Using the Built-In Image Editor

The editor has a built-in photo editing tool — no Photoshop needed.

  1. Click on an image to select it
  2. Click Edit Image in the toolbar
  3. The image editor opens with the following tools:
    • Crop — trim the image to a specific size or ratio
    • Rotate / Flip — rotate the image or flip it horizontally/vertically
    • Brightness, Contrast, Saturation — adjust the look of the photo
    • Filters — apply a stylistic filter (black and white, vintage, etc.)
    • Blur — add a blur effect
    • Text — overlay text directly onto the image
    • Stickers / Icons — add graphic elements to the image
    • Border / Stroke — add a border around the image
  4. When done, click Save

Adding Alt Text to an Image

Alt text is a short description of an image that search engines and screen readers use. Every image should have it.

  1. Click on an image to select it
  2. Look for the Alt Text field in the image settings or design panel
  3. Type a short, descriptive label — e.g., "veteran-owned landscaping crew working on a Phoenix front yard"
  4. Click Done or press Enter

↑ Back to Top

Section 7: Working With Buttons

Buttons are one of the most important elements on your site — they tell visitors exactly what to do next. Here's how to edit them.

Editing Button Text

  1. Click on any button on the canvas to select it
  2. Double-click to enter edit mode
  3. Type your new button label (e.g., "Get a Free Quote," "Contact Us," "Learn More")
  4. Click outside the button when done

Changing a Button's Link

  1. Click the button to select it
  2. Click Edit Content or the link icon in the toolbar
  3. Choose where the button should go: a page on your site, an external URL, an email address, or a phone number
  4. Enter the destination and click Done

Changing Button Style

  1. Click the button to select it
  2. Click Edit Design in the toolbar — the design panel opens on the right
  3. From here you can:
    • Switch between your site's Primary and Secondary button styles
    • Adjust background color, text color, and border color
    • Change border width and rounded corners
    • Add a shadow effect
    • Adjust button width and height
    • Change the font, font size, and text formatting
    • Adjust inner and outer spacing(padding and margin)

Resetting a Button to Theme Style

If you've changed a button's styling and want to revert it back to your site's default button look:

  1. Click the button and open Edit Design
  2. Click Reset to Theme Style

↑ Back to Top

Section 8: Adding and Managing Widgets

Widgets are the building blocks of your website — every piece of content you see is a widget. Text blocks, images, buttons, maps, videos, contact forms, galleries, social media icons — all widgets. Here's how to add and work with them.

How to Add a Widget

  1. In the left side panel, click Add
  2. Click the Elements tab to see the full widget library
  3. Find the widget you want (or search for it by name)
  4. Click and drag it from the panel onto the canvas — drop it where you want it to appear

Available Widgets

Here's a breakdown of the widgets available to you:

Text & Content

  • Text — a standard paragraph text block
  • Title / Heading — larger text for section headings (H1 through H6)
  • HTML — paste custom HTML code directly onto the page

Media

  • Image — a single image
  • Gallery — a grid or slideshow of multiple images
  • Video — embed a YouTube, Vimeo, or self-hosted video
  • Audio Player — embed an audio clip or podcast episode
  • Icon — add a scalable icon from the built-in icon library

Navigation & Structure

  • Button — a clickable call-to-action button
  • Divider — a horizontal line to separate sections of content
  • Spacer — adds invisible vertical space between elements
  • Navigation Menu — a standalone menu element
  • Anchor — an invisible marker that lets you link to a specific spot on a page

Contact & Leads

  • Contact Form — a form that sends submissions to your email and saves them in your dashboard
  • Map — an embedded Google Map showing your business location
  • Business Hours — displays your operating hours, formatted automatically
  • Click-to-Call — a phone number visitors can tap to call directly from their phone

Social

  • Social Icons — links to your social media profiles with recognizable platform icons
  • Facebook Like Button — lets visitors like your Facebook page directly from your site
  • Instagram Feed — displays your latest Instagram posts

Other

  • Slideshow — a full-width image slider
  • Testimonials — a dedicated widget for displaying customer reviews
  • Countdown Timer — counts down to a specific date/time
  • PayPal Button — a simple PayPal payment or donation button
  • Pop-up — a window that appears over the page (great for promotions or announcements)

Editing a Widget's Content

  1. Click the widget on the canvas to select it
  2. Click Edit Content in the small toolbar that appears
  3. Make your changes in the content panel that opens
  4. Click Done when finished

Editing a Widget's Design

  1. Click the widget to select it
  2. Click Edit Design in the toolbar
  3. The design panel opens on the right — adjust colors, borders, spacing, shadows, and more

Moving a Widget

  1. Click the widget to select it
  2. Click and hold, then drag it to its new position on the canvas
  3. Release to drop it in place

Copying and Pasting a Widget

  1. Right-click the widget on the canvas
  2. Select Copy
  3. Right-click elsewhere on the canvas and select Paste

Deleting a Widget

  1. Click the widget to select it
  2. Press the Delete key on your keyboard — or right-click the widget and select Delete

Hiding a Widget on a Specific Device

Sometimes a widget looks great on desktop but clutters up the mobile view. You can hide any widget on a specific device without deleting it.

  1. Right-click the widget on the canvas
  2. Select Hide on Device
  3. Choose Desktop, Tablet, or Mobile
  4. The widget will be invisible on that screen size but still visible on the others

Setting a Widget as Fixed (Always Visible While Scrolling)

You can pin any widget to the screen so it stays visible as the visitor scrolls — useful for a persistent call-to-action button or phone number.

  1. Click the widget to select it
  2. Click Edit Design
  3. In the design panel, scroll to the Position section
  4. Change the position type to Fixed

↑ Back to Top

Section 9: Working With Sections and Rows

Your page is made up of horizontal sections (also called rows). Each section can have its own background, spacing, columns, and content. Understanding sections is key to making bigger layout changes.

Adding a New Section

  1. Hover between two existing sections on the canvas — a blue + Add Section button will appear
  2. Click it
  3. Choose from two options:
    • Designed — pick from a library of pre-built, professionally designed section templates organized by category (Intro, About, Features, Testimonials, Team, and more)
    • Blank — add an empty section you can build from scratch
  4. Select the section you want and click Save to add it to the page

Moving a Section Up or Down

  1. Hover over the top-left corner of the section until the section controls appear
  2. Click the Row / Section label button
  3. Click the Move Up or Move Down arrows

Copying a Section

  1. Hover over the section controls
  2. Click the Row / Section button
  3. Click Copy
  4. A duplicate of the section will appear below it — you can then move it wherever you need it

Deleting a Section

  1. Hover over the section controls
  2. Click the Row / Section button
  3. Click Delete and confirm

Warning: Deleting a section removes everything inside it — all widgets, content, and design. Use Undo immediately if you delete something by accident (see Section 18).

Hiding a Section on a Specific Device

  1. Click the section controls
  2. Click Hide on Device
  3. Select which device to hide it on

Adding an Entrance Animation to a Section

  1. Click the section controls
  2. Click Entrance Animation
  3. Choose an animation style (fade in, slide from left, zoom in, etc.)
  4. The animation will play when the section scrolls into view

Setting a Section as an Anchor

Anchors let you link directly to a specific section on a page — great for navigation buttons that jump to a specific part of a page.

  1. Click the section controls
  2. Click Set as Anchor
  3. Type a name for the anchor (e.g., "services" or "contact")
  4. Click Save
  5. Now you can link buttons or menu items to that anchor using the URL format #anchor-name

↑ Back to Top

Section 10: Working With Columns

Every section contains at least one column. Columns are the vertical containers that hold your widgets. Understanding columns lets you control how content is arranged side by side.

Adding a Column to a Section

  1. Right-click anywhere inside the section
  2. Select Add Column
  3. A new column will appear alongside the existing one
  4. You can have up to 4 columns on desktop, and up to 2 on mobile

Resizing Columns

  1. Hover over the border between two columns — a resize handle will appear
  2. Click and drag left or right to adjust the column widths

Moving a Column

  1. Right-click the column
  2. Use the Move Column Left or Move Column Right arrows

Deleting a Column

  1. Right-click the column
  2. Click Delete

Note: Deleting a column removes all widgets inside it. If you just want to remove a widget, delete the widget, not the column.

Adding an Inner Row to a Column

Sometimes you need more layout complexity within a single column — for example, a heading above two side-by-side buttons. Inner rows let you do this.

  1. Right-click the column
  2. Click Add Inner Row
  3. A new row appears inside the column — you can split this inner row into its own columns and add widgets independently

Column Design — Background, Border, Shadow

  1. Right-click the column
  2. Click Edit Design
  3. The design panel opens — set a background color, image, or video for just that column
  4. Add a border, rounded corners, or shadow if needed

↑ Back to Top

Section 11: Backgrounds — Color, Image, and Video

You can set a background for any section or column — a solid color, a photo, a gradient, or even a video. This is one of the most impactful design tools available.

Setting a Section Background

  1. Hover over the section controls (top-left of the section)
  2. Click the Row / Section button
  3. Click Edit Design
  4. In the design panel, go to the Style tab
  5. Choose your background type: Color, Image, or Video

Color Background

  • Click Color and use the color picker to select a solid color or create a gradient
  • You can also adjust opacity for a semi-transparent effect

Image Background

  1. Click Image and select a photo from your library, Unsplash, or upload one
  2. Set how the image displays: Cover (fills the section), Full Image, Tile, or No Repeat
  3. Enable Parallax Scrolling for a cinematic scrolling effect where the background moves slower than the page content
  4. Add a Background Overlay — a semi-transparent color layer over the image (great for making text readable on top of a busy photo)
  5. You can also add multiple images to create a Background Image Slider — set the transition style and slide speed

Video Background

  1. Click Video
  2. Paste the URL of a YouTube, Vimeo, or Dailymotion video
  3. The video will play silently on loop as a background behind your section content

Tip: When using a photo or video background, always add a dark overlay so any text placed on top remains easy to read. A background with no overlay and light-colored text is a common mistake that makes content hard to see.

↑ Back to Top

Section 12: Animations and Entrance Effects

Entrance animations make elements fade, slide, or zoom into view as a visitor scrolls down your page. Used tastefully, they make a site feel polished and modern.

Adding an Animation to a Section

  1. Hover over the section controls
  2. Click the Row / Section button
  3. Click Entrance Animation
  4. Choose your animation from the list (Fade In, Slide from Left, Slide from Right, Zoom In, Bounce In, etc.)
  5. The animation will preview on screen so you can see how it looks
  6. Click Save

Adding an Animation to a Widget

  1. Click the widget to select it
  2. Click Edit Design to open the design panel
  3. Scroll to the Animation section
  4. Choose an entrance animation

Removing an Animation

  1. Follow the same steps as adding one
  2. In the animation options, select None
  3. Click Save

Tip: Less is more with animations. A fade-in on each section as visitors scroll is effective and professional. Avoid using bouncing, spinning, or flashing animations — they distract from your content and can feel unprofessional. Keep it clean and subtle.

↑ Back to Top

Section 13: Managing Pages

You can add new pages, rename existing ones, change their order in the navigation, duplicate them, and more — all from inside the editor.

Viewing Your Page List

  1. In the left side panel, click Pages
  2. Your full list of pages appears — including their order and which ones are in your navigation menu

Adding a New Page

  1. In the Pages panel, click + Add Page
  2. Give your page a name and a URL slug (the URL slug is the part that appears at the end of your web address — e.g., "/new-service")
  3. Choose a starting point:
    • Page Builder — choose from a library of pre-built section layouts to assemble a page
    • Blank Page — start with a completely empty canvas
    • Duplicate an existing page — copy an existing page and customize it
  4. Click + Add Page to create it

Renaming a Page

  1. In the Pages panel, hover over the page name
  2. Click the three-dot menu (•••) next to it
  3. Select Rename
  4. Type the new name and confirm

Duplicating a Page

  1. In the Pages panel, hover over the page
  2. Click the three-dot menu
  3. Select Duplicate
  4. A copy of the page appears in your list — rename it and edit as needed

Changing Page Order in Navigation

  1. In the Pages panel, click and hold a page name
  2. Drag it up or down to reorder it
  3. The navigation menu on your site will automatically update to reflect the new order

Hiding a Page From Navigation

You can have a page on your site that's accessible via a direct URL but doesn't show up in the main navigation — useful for landing pages, thank-you pages, or pages you're still working on.

  1. In the Pages panel, click the three-dot menu next to the page
  2. Toggle off Show in Navigation

Deleting a Page

  1. In the Pages panel, click the three-dot menu next to the page
  2. Select Delete and confirm

Note: Deleting a page is permanent and removes all of its content. If you're not sure, hide it from navigation instead — that way it's off the menu but still recoverable.

Adding a Popup

Popups are windows that appear over the top of your page — great for announcements, promotional offers, or newsletter signups. You can add and manage them from the Pages panel.

  1. In the Pages panel, scroll to the bottom and look for Popups
  2. Click + Add Popup
  3. Choose a popup layout or start blank
  4. Design the popup content just like any other page
  5. Set the trigger (on page load, after a delay, on exit intent, on scroll)
  6. Set display frequency (every visit, once per session, once per user)
  7. Publish when ready

↑ Back to Top

Section 14: Managing Your Header and Footer

Your header (the top bar with your logo and navigation) and footer (the bottom section of your site) appear on every page. Any changes you make to them update everywhere at once.

Editing the Header

  1. Scroll to the very top of the canvas in the editor
  2. Click anywhere inside the header to select it
  3. Click on individual elements to edit them — your logo, navigation links, phone number, buttons, etc.

Editing Your Logo

  1. Click on the logo in the header
  2. Click Change Image in the toolbar
  3. Upload your new logo or select it from your image library
  4. Adjust size and positioning as needed

Editing Navigation Menu Links

  1. Click on the navigation menu in the header
  2. Click Edit Content
  3. You'll see a list of menu items — you can rename them, reorder them, add new items, or delete existing ones
  4. For each menu item, set whether it links to a page on your site, an external URL, or a section anchor
  5. You can also create dropdown menus by nesting sub-items under a parent menu item
  6. Click Done when finished

Editing the Footer

  1. Scroll to the very bottom of the canvas
  2. Click anywhere inside the footer to select elements and edit them
  3. Footer content typically includes your business name, contact info, social links, copyright, and any footer navigation
  4. Edit each element the same way you would on any other part of the page

Remember: Header and footer edits apply across every page of your site automatically — so a change made once shows up everywhere. This is the most efficient place to update your phone number, address, or logo.

↑ Back to Top

Section 15: Site Theme — Colors, Fonts, and Global Styles

Your site theme controls the default look of your entire website — colors, fonts, button styles, spacing, and more. Changes made in the theme automatically apply site-wide, unless an individual element has been manually overridden.

Opening the Theme Panel

  1. In the left side panel, click Theme
  2. The theme panel opens with all of your global design settings

Colors

  1. In the Theme panel, find the Colors section
  2. You'll see your site's color palette — typically a primary color, secondary color, background color, and text color
  3. Click any color swatch to open the color picker and change it
  4. Any element on your site that uses that color will update automatically

Tip: Your brand colors are already set up as part of your Code Camo site. Be careful when changing theme colors — it affects everything at once. If you're not sure, contact Code Camo before making changes here.

Fonts

  1. In the Theme panel, find the Text or Fonts section
  2. You can set separate fonts for:
    • Headings(H1 through H6)
    • Body Text
    • Buttons and Menus
  3. Click the font name to open the font selector — choose from over 100 Google Fonts or any fonts already loaded on your site
  4. You can also set font weight (regular, bold, light), font size, line height, and letter spacing globally here

Buttons

  1. In the Theme panel, find the Buttons section
  2. Your site has two button styles: Primary and Secondary
  3. You can set the background color, text color, border style, rounded corners, and hover state for each
  4. Every button on your site that uses Primary or Secondary style will update when you change these settings

Spacing

The theme lets you set default spacing (padding) for rows and columns site-wide. Individual rows and columns can override this, but the theme setting is the baseline everything starts from.

Background

You can set a default background color or image for the entire site from the theme panel. This shows in areas that don't have their own background set.

Images

The theme includes default image styling — border style, rounded corners, shadow effects — that applies to all image widgets on your site unless overridden.

↑ Back to Top

Section 16: Managing Your Blog

If your website includes a blog, you can manage it directly inside the editor. Here's how to access it and everything you can do.

Opening the Blog Manager

  1. In the left side panel, click More
  2. Click Blog
  3. The blog manager opens, showing your list of posts

Adding a New Post

  1. In the blog manager, click + New Post
  2. Give your post a title
  3. Write or paste your content into the editor
  4. Add a cover image (appears at the top of the post and in the blog listing grid)
  5. Write a short excerpt — this is the preview text that shows under the title on your blog page
  6. Assign categories or tags if applicable
  7. Set the post's SEO meta title and description
  8. Click Publish when ready, or Save as Draft to come back to it later

Scheduling a Post

  1. Write and set up your post as normal
  2. Click the dropdown arrow next to the Publish button
  3. Select Schedule
  4. Pick your publish date and time
  5. Confirm — the post goes live automatically at that time

Editing an Existing Post

  1. In the blog manager, click the post you want to edit
  2. Make your changes
  3. Click Update — changes go live immediately on published posts

Blog Categories and Tags

  • Categories — broad groupings for your posts (e.g., "Tips," "News," "Resources")
  • Tags — specific keywords describing what a post is about

To assign categories or tags, open the post and look for the Categories and Tags fields in the post settings panel. You can create new ones on the fly.

Deleting a Post

  1. In the blog manager, hover over the post
  2. Click the three-dot menu
  3. Select Delete and confirm

↑ Back to Top

Section 17: Using the Layers Panel

The Layers panel gives you a bird's-eye view of every element on the current page — laid out in a hierarchical tree. It's especially useful when elements are overlapping and you can't easily click what you need on the canvas.

Opening the Layers Panel

  1. In the left side panel, click Layers
  2. A hierarchical list of all elements on the page appears — sections at the top level, then columns, then widgets inside each

Selecting an Element via Layers

  1. Click any item in the Layers list
  2. The corresponding element on the canvas will be highlighted and selected
  3. You can then edit it normally

Expanding and Collapsing

  • Click the arrow next to any section or column to expand it and see what's inside
  • Click again to collapse it

When is this useful? If you have overlapping elements, a widget hidden behind another one, or a complex layout where clicking on the canvas keeps selecting the wrong thing — the Layers panel lets you target exactly the element you want.

↑ Back to Top

Section 18: Undo, Redo, and Saving

Made a mistake? Don't panic. The editor has undo and redo built in, and your work is saved automatically.

Undo

  • Click the Undo button in the top navigation bar (curved arrow pointing left)
  • Or press Ctrl+Z(Cmd+Z on Mac)
  • Each click steps back one action — you can undo multiple steps in a row

Redo

  • Click the Redo button (curved arrow pointing right)
  • Or press Ctrl+Y(Cmd+Y on Mac)

How Saving Works

The editor saves your work automatically as you go. You'll see a checkmark icon in the top navigation bar that indicates your progress has been saved. You don't need to manually save.

However, saved changes are not the same as published changes. Your edits are saved to a draft version of your site. Visitors won't see them until you click Publish(see Section 19).

↑ Back to Top

Section 19: Publishing Your Changes

Saving your work stores it in a draft. Publishing is what makes those changes visible to the world on your live website. Nothing goes live until you publish.

How to Publish

  1. When you're done making changes, click the Publish or Republish button in the top right of the editor
  2. A confirmation prompt may appear — confirm and your changes go live within seconds

Publish vs. Republish

  • Publish — appears if this is the first time the site is being made live
  • Republish — appears after the site has been published before; pushing an update to the existing live site

Preview Before Publishing

Always recommended — click Preview before you publish to see exactly how your changes will look to visitors. Check desktop and mobile views. If everything looks right, go ahead and publish.

Good habit to build: Make your edits → preview on desktop → preview on mobile → publish. Doing it in that order saves you from publishing something that looks great on a computer but broken on a phone.

↑ Back to Top

Section 20: Tips for Editing Like a Pro

You now have a full picture of everything the editor can do. Here are a few habits that will make you faster, cleaner, and more confident every time you open it.

  • Preview before you publish — every time. It takes 30 seconds and will save you from embarrassing typos or broken layouts going live on your site.
  • Check mobile view after every significant edit. A layout that looks perfect on desktop can fall apart on a phone. The mobile audience is too big to ignore.
  • Use Undo freely. Don't be afraid to try things. If it looks wrong, Ctrl+Z will take you right back. Experiment.
  • Keep text edits concise. Your website visitors skim — they don't read every word. Short, punchy paragraphs with clear headings perform better than walls of text.
  • Use the Layers panel when things get frustrating. If you can't click what you need on the canvas, the Layers panel will always let you select it precisely.
  • Don't change theme settings without thinking it through. The theme controls your entire site. A color change there affects everything. For major design changes, submit a request to Code Camo instead.
  • Don't delete — hide first. If you're not sure whether you'll want something back, hide it instead of deleting it. Whether it's a widget, a section, or a page, hiding is always reversible.
  • Keep your images high quality but reasonably sized. Huge image files slow your site down. Before uploading, resize photos to a maximum of 1920px wide at 72dpi — that's plenty for a website and loads fast.
  • Submit update requests when things feel out of your depth. That's what Code Camo is here for. There's no shame in it — some changes require more than the editor alone, and we'd rather do it right for you than have you fighting with something for hours.

↑ Back to Top

Need Help?

If you run into something the editor can't handle, or you'd rather have Code Camo take care of a change for you — we've got you.

You've got a professional website. Now you've got a professional's understanding of how to use it.

Code Camo is a veteran-owned web design agency built exclusively for veteran business owners. We handle the tech so you can stay focused on the mission.

< Older Post

 Newer Post >

How to Set Up Your Google Business Profile: A Step-by-Step Guide for Veteran Business Owners

By Robert Hole • August 26, 2026
If your veteran-owned business isn't showing up on Google Maps, you're invisible to a massive portion of your potential customer base. Setting up a Google Business Profile — completely free — fixes that.

How to Get More Google Reviews for Your Veteran-Owned Business (And What to Say When Asking)

By Robert Hole • August 21, 2026
Here's something most veteran business owners already know but don't always act on: Google reviews are one of the most powerful marketing tools available to a small business — and they're completely free.
Show More