XenForo'da forumunuzun ana sayfasına (ya da ekleyeceğiniz başka bir şablonu seçerek farklı bir sayfasına) Google Özel Arama kutusu eklemeyi sizlere bu konumda göstereceğim.

Öncelikle https://cse.google.com/cse/ adresinden özel arama motorunuzu hazırlayarak kodunuzu alın. Kodunuz şöyle bir şey olacaktır:
<script>
  (function() {
    var cx = 'BURADA KENDİ IDNİZ OLACAKTIR';
    var gcse = document.createElement('script');
    gcse.type = 'text/javascript';
    gcse.async = true;
    gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
        '//cse.google.com/cse.js?cx=' + cx;
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(gcse, s);
  })();
</script>
<gcse:search></gcse:search>
Hadi buna biraz stil verelim.

Burada en sondaki <gcse:search></gcse:search> kısmını keserek yerine şunu yazın:
<div class="google_search">
        <span class="notice_search">Google'da Arayın...</span>
        <gcse:search></gcse:search>
</div>
Ardından ad_below_top_breadcrumb şablonunu açın ve son haliyle kodunuzu buraya ekleyin.
  • Not 1: ad_ şablonlarına eklediğinizde Adblock vb. reklam eklentileri arama kutusunu gizlemektedir, bilginize.)
  • Not 2: Bu şablon genellikle reklam eklemek için kullanılır, eğer siz de daha önceden buraya reklam eklediyseniz yeni kodunuzu ona göre yerleştirin.)

Şimdi de şu CSS kodlarını extra.css şablonunuza ekleyin ki yaptığımız stillendirme çalışsın:
/* GOOGLE ÖZEL ARAMA */
.google_search .notice_search {
    background: #e68c17 ;
    color: #ffffff;
    padding: 5px 10px;
    font-size: 14px;
    font-family: 'Roboto', Arial, sans-serif;
    border-bottom-right-radius: 5px;
}

.google_search {
    border: 5px solid #e68c17 ;
    border-radius: 5px;
}
/* GOOGLE ÖZEL ARAMA SONU */
notice_search kısmındaki background ve google_search kısmındaki border kodunda bulunan renk kodunu kendi forumunuza uygun bir tanesiyle değiştirebilirsiniz.

DEMO

Stillendirme olmadan:


Stillendirme sonrası: