Skip to content

Editable redirects

Redirect visitors to external resources.

Imagine you are building a new website for your client, but they already have their blog on Tumblr and they use zendesk to provide support for their world famous product. Of course, they want to have both a "Blog" und a "Support" link in their main menu and they want to be able to sort the menu items and maybe rename them later. At a later point in time, they might switch from Desk.com to another service, so these links have to be editable.

Redirects are the way to solve this problem.

Manually creating folders

To achieve this, we add a folder for each redirect, in this case a /blog and a /support folder:

  • content
    • 1_about-us
    • 2_our-product
    • 3_blog
    • 4_support
    • 5_contact

To list them in the menu, we prepend a number with the position where we want it to appear in the menu.

Inside each folder, we put a link.txt content file. You can freely choose the name of this file, use what works best for you or your client.

The link.txt file has just two fields. The title field and a link field:

Title: Blog
----
Link: https://ourawesomeproduct.tumblr.com
----

…and…

Title: Support
----
Link: https://www.zendesk.com/ourawesomeproduct
----

Your clients can change the content later.

The blueprint for the Panel

To make these pages editable in the Panel, add a /site/blueprints/pages/link.yml blueprint with the following content:

/site/blueprints/pages/link.yml
title: Link

fields:
    link:
      label: Link URL
      type: url

The template

Now we need a template for that. Add a link.php file to your template folder:

  • site/templates/link.php

All we want that template to do, is to redirect the visitor to the link from the content file. So it's just one line of code:

/site/templates/link.php
<?php go($page->link(), 301) ?>

This template doesn't display anything to the visitor but redirects directly to the given link address. The go() helper function can be used everywhere and does instantly redirect your visitor to the given URL.

Now whenever someone visits https://yourclientsdomain.com/blog, they will be redirected to https://ourawesomeproduct.tumblr.com and whenever someone visits https://yourclientsdomain.com/support they will be redirected to https://zendesk.com/ourawesomeproduct. The menu is 100% editable and you don't need to hack anything. Another side effect is that your client now has those nice custom URLs for their external support platform and blog.

Once you've installed such a link.php template you can also use it to create more custom shortened links for your client. By adding invisible folders to the main content folder you could also create redirects like http://yourclientsdomain.com/facebook or http://yourclientsdomain.com/someothershortenedlink

Route instead of template

Instead of using a template, the same could be achieved with a route instead of a template:

/site/config/config.php
<?php
return [
    'routes' => [
        [
          'pattern' => '(:any)',
          'action'  => function ($uid) {
            $page = page($uid);
            if($page && $page->intendedTemplate() == 'link') {
              return go($page->link(), 301);
            }
            return $page;
          }
        ]
      ]
];