Theme Builder Plugin

[All Adaptavist Apps]

Page tree

  • Created by Unknown User (mattbovett), last modified on Mar 21, 2008

When folks do a search on our site using the search box, it takes them into the default theme for the whole wiki (takes them out of our ThemeBuilder theme/layout). Is there any way to specify what theme that uses?

  • No labels

6 Comments

  1. Unknown User (gfraser)

    Not currently - the only way you can currently get it to use the layout of a specific space, for example, is to append &key=SPACEKEY (where SPACEKEY is the key of a space) to the end of the URL.

    1. Unknown User (mattbovett)

      Cool! That's better than nothing!

      I added this to the search form code:

      <input type="hidden" name="key" value="its">

      Then I added this to the Page Title panel:

      {builder-show:action=dosearchsite}
{style:import}
     .searchGroup { display: none; }
{style}
{builder-show}

      That hides the right side of the search table where you can perform another search so it forces users to use the search box in our left sidebar. We don't need them to be able to filter content really. Not right now anyway.

      I wish I could stretch the left column of the search table to 100% but oh well. If you know a way let me know. (smile)

      And I wish we could hide the top part of the left column too:

      Searched for image in iTS Wiki.
      There are 256 matches in other spaces. Include these matches.

      Because if you click "include these matches", it breaks you out of the Theme Builder theme like it would if you had performed a new search from the right column that I hid.

      But again, oh well. (smile)

      1. Unknown User (mattbovett)

        Nevermind, adding this to the import did the trick to stretch the table:

        .pagebody td { width: 100% }

        I'm kind of a CSS... novice. But I'm learning. (smile)

        1. Unknown User (mattbovett)

          Furthermore, we found out that the bottom number links that let you go through the search result pages, if any links in there were clicked by the user, they'd be pulled out of our Theme Builder layout.

          So we added this javascript code to our footer which adds "&key=ourspacekey" to the end of every link on click (when doing the dosearchsite action), but not any other link on the page. We used the "centered" class which we found in the code to target the links in there only.

          {builder-show:action=dosearchsite}
{html}
<script type="text/javascript" charset="utf-8">
var propercontainer = document.getElementsByTagName('div');
for(j = 0; j < propercontainer.length; j++){
if (propercontainer[j].className=="centered") {
var links = propercontainer[j].getElementsByTagName('a');
for(i = 0; i < links.length; i++) {
links[i].onclick = function()
{ window.open(this.href + "&key=its","_self");
return false;
}
}
}
}
</script>
{html}
{builder-show}

          And finally, we had to do some more cleaning up with CSS to get rid of the top box that lets you break out of the space you're in and look for results in other spaces, as those links would take you out of the theme, too. Adding this code in the header inside a "{builder-show:action=dosearchsite}" did the trick and made everything look shiny:

          .pagebody table { border: 1px #fff solid !important; padding: 0px !important; }
.pagebody { margin-top: -4px; }
.pagebody tr:first-child td:first-child tr:first-child td:first-child { display: none; }

          I know... details, details...

          1. Unknown User (gfraser)

            Is your site accessible to the public? If so, turn off the {html} macro as it allows anyone with edit privs (that includes comments) to inject nasty stuff.

            We normally create a User Macro (Site Admin > User Macros) and dump the HTML in to that then simply reference the user macro in the wiki notation.

            Have you tested that JS on MSIE? If it's running before the DOM is ready, IE will bork big time.

            A jQuery equivalent for the javascript, taking in to account browser differences and DOM ready state, would be:

            jQuery(function($){
  var space = '&key=its';
  $('div.centered a, div.searchGroup a').each(function(){
    var $this = $(this);
    $this.attr('href',$this.attr('href')+space);
  });
});

            The code above will change the actual href of the <a> elements both in the page links at the bottom and also in the search options at the side of the screen.

            If you wanted to also update the "include these matches" from the panel above the search results you could update the jQuery selector to:

            $('div.centered a, div.searchGroup a, .pagebody tr:first-child td:first-child tr:first-child td:first-child a')...etc...

            You'd obviously need jQuery enabled on the JS tab in layout manager.

            (smile)

            1. Unknown User (mattbovett)

              Hmm interesting about the jQuery solution. I'll try it out.

              Our site's internal only, and nobody uses IE, so we don't even test on there.