Move the Search Box

It is a rather simple task to move your Search box from one location to another; however, you will need to understand a bit about templates first.

  1. Your website's template contains editable and non-editable "regions." The Search box (and the Login box) must be associated with one of these editable regions. It can be placed either before (pre) any other content in the region, or it can be placed after (post) any content in the region.
  2. In this illustration, the Seach box has been placed in the pre Right Content region. The Login box has been placed in the pre Left Content Region.

    You can place the Search box (or the Login box) pre or post any of the editable regions. These regions are shown in this illustration.
  3. To move the Search box, begin by clicking on the Template Module and then selecting the root level page.
  4. Click on the edit Setup icon and scroll to the bottom of the form.
  5. Next, you will need to add your TypoScript code. Although the code is simple, you will need to modify it based on where you want to place the Search box.
  6. The lines of code are:

    # Move Search Box
    lib.leftcontent_pre < lib.search
    lib.search >

    This would place the Search box at the top of the Left Content region.
  7. To place the Search box after the Left Content region, the code would be:

    # Move Search Box
    lib.leftcontent_post < lib.search
    lib.search >
  8. Use the following to determine where you would place your Search box:

    maincontent
    leftcontent
    rightcontent
    bannerimg
    subcontent
  9. Now, we'll place our Search box after the Main Content region.

    # Move Search Box
    lib.maincontent_post < lib.search
    lib.login >
  10. Scroll up to the top of the Setup form and click on the Update button to save your work. Then click on the Show page icon to view the results.
  11. As you can see, the Search box has moved to the maincontent_post location, just as we'd planned. You can use these same instructions to move the Login box by replacing the lib.search code with lib.login.

Tutorial

Movie Tutorial Click to see tutorial for: Move the Search Box