DEV Community

Steven K
Steven K

Posted on

How to create editable links with LiveCMS

Content editors should not need to open a PHP file just to change a link.

That is the idea behind Live CMS:

Click, Edit, Done.

For content editors.

Watch the video on YouTube

The video highlights Click, Edit, and Done in sequence. The orange highlight on “Edit” represents the main action: updating content directly from the page instead of searching through theme files.

How it works

A developer marks editable content with HTML comments inside a normal WordPress template:

<!-- lcms:link cta_link -->
    <div>
        <a href="<?php echo esc_url($link_url); ?>">
            <?php echo esc_html("The LiveCMS Website"); ?>
        </a>
    </div>
<!-- /lcms -->
Enter fullscreen mode Exit fullscreen mode

The comments are invisible in the browser. They tell Live CMS where the editable region starts and ends.

  • lcms identifies a Live CMS marker.
  • link identifies the content type.
  • cta_link is the developer’s name for the field.

The surrounding HTML and PHP remain ordinary theme code. WordPress escaping functions still protect the output: esc_url() handles the link URL, and esc_html() handles visible text.

Why this helps

WordPress gives developers detailed control over custom themes. However, a small content change can still require a developer if editors do not know which template or field controls it.

Live CMS creates a clearer handoff:

  • Developers define the editable areas.
  • WordPress continues to render the page.
  • Editors update marked content from the front end.

Requirements

Before installing Live CMS, you need:

  • WordPress 6.0 or newer
  • PHP 7.4 or newer
  • A theme that calls wp_head() and wp_footer()

Live CMS is installed as a standard WordPress plugin ZIP. There are no external dependencies, API keys, or front-end build steps required.

The goal is simple: keep the power of custom WordPress development while making everyday content updates faster for the people who manage the site.

Try it for free

Read the full installation and developer workflow

Top comments (0)