Кастомизация облака тегов

​

Решил попробовать сделать симпатичные ссылки в облаке тегов и столкнулся с несколькими проблемами по части настройки шаблона.
В частности речь о полном отсутствии возможности настроить свой шаблон. Еще и эти обязательные "запятые" тоже не к месту, а чтобы что-то изменить или убрать - необходимо только вносить изменения в сами php файлы. Вот решением этих проблем мы и займемся. И в качестве бонуса дам код и стили тегов как на картинке.
Установка
Открыть файл engine/modules/show.full.php
Найти строку:

Код:

            $tpl->set( '{tags}', implode( ", ", $tags ) );

После нее вставить:

Код:

////////////////////////////////////////////////////////////////////////////////////////////////
            if(preg_match("#{tags=['\"]([^'\"]*)['\"]}#i",$tpl->copy_template,$sep)) $tpl->set($sep[0],implode($sep[1],$tags));
////////////////////////////////////////////////////////////////////////////////////////////////

Теперь в шаблоне fullstory.tpl можно выводить теги тегом:

Код:

{tags=""}

где в кавычках указывается символ или текст разделитель между тегами. Вот так можно повторить вывод стандартного тега:

Код:

{tags}
{tags=", "}

Теперь сама страница облака тегов:
Открыть файл engine/modules/tagscloud.php
Найти строку:

Код:

        } else $sql_select = "SELECT tag, COUNT(*) AS count FROM " . PREFIX . "_tags GROUP BY tag";

После нее вставить:

Код:

////////////////////////////////////////////////////////////////////////////////////////////////
        $tagsort = 'tag';
        if(preg_match("#\\[list([^\]]*)\\](.+?)\\[/list\\]#is",$tpl->copy_template,$tpl_list)){
            $limit = false;
            $sep = '';
            if(preg_match("#limit=['\"](\d+)['\"]#i",$tpl_list[1],$lm)){
                $lm = intval($lm[1]);
                if($lm>0){
                    $limit = true;
                    $sql_select = "SELECT tag, COUNT(*) AS count FROM " . PREFIX . "_tags GROUP BY tag ORDER BY count DESC LIMIT 0,$lm";
                }
            }
            if(preg_match("#sep=['\"]([^'\"]*)['\"]#i",$tpl_list[1],$sp)) $sep = $sp[1];
            if(preg_match("#sort=['\"](count|tag)['\"]#i",$tpl_list[1],$tgsr)) $tagsort = $tgsr[1];
        }
        if(!$limit) $sql_select = "SELECT tag, COUNT(*) AS count FROM " . PREFIX . "_tags GROUP BY tag ORDER BY count DESC";
////////////////////////////////////////////////////////////////////////////////////////////////

Найти строку:

Код:

        usort ($list, "compare_tags");

ПЕРЕД ней вставить:

Код:

////////////////////////////////////////////////////////////////////////////////////////////////
        if($tagsort=='tag')
////////////////////////////////////////////////////////////////////////////////////////////////

Найти код:

Код:

                if ($config['allow_alt_url'] )
                    $tags[] = "<a href=\"".$config['http_home_url']."tags/".urlencode($value['tag'])."/\" class=\"{$value['size']}\" title=\"".$lang['tags_count']." ".$value['count']."\">".$value['tag']."</a>";
                else
                    $tags[] = "<a href=\"$PHP_SELF?do=tags&amp;tag=".urlencode($value['tag'])."\" class=\"{$value['size']}\" title=\"".$lang['tags_count']." ".$value['count']."\">".$value['tag']."</a>";

Заменить на:

Код:

////////////////////////////////////////////////////////////////////////////////////////////////
                if($tpl_list[2]){
                    if ($config['allow_alt_url'] ) $link = $config['http_home_url']."tags/".urlencode($value['tag'])."/";
                    else $link = $PHP_SELF."?do=tags&tag=".urlencode($value['tag']);
                    $temp = $tpl_list[2];
                    $temp = str_ireplace("{link}",$link,$temp);
                    $temp = str_ireplace("{tag}",$value['tag'],$temp);
                    $temp = str_ireplace("{count}",$value['count'],$temp);
                    $tags[] = $temp;
                }else{
                    if ($config['allow_alt_url'] )
                        $tags[] = "<a href=\"".$config['http_home_url']."tags/".urlencode($value['tag'])."/\" class=\"{$value['size']}\" title=\"".$lang['tags_count']." ".$value['count']."\">".$value['tag']."</a>";
                    else
                        $tags[] = "<a href=\"$PHP_SELF?do=tags&amp;tag=".urlencode($value['tag'])."\" class=\"{$value['size']}\" title=\"".$lang['tags_count']." ".$value['count']."\">".$value['tag']."</a>";
                }
////////////////////////////////////////////////////////////////////////////////////////////////

Найти строку:

Код:

        $tags = implode(", ", $tags);

ПЕРЕД ней вставить:

Код:

////////////////////////////////////////////////////////////////////////////////////////////////
        if($tpl_list[0]) $tpl->copy_template = str_replace($tpl_list[0],implode($sep,$tags),$tpl->copy_template);
////////////////////////////////////////////////////////////////////////////////////////////////

Теперь в шаблоне tagscloud.tpl можно вместо просто тега {tags} использовать конструкцию:

Код:

[list limit="100" sep="" sort="count"]<a href="{link}"><span class="tagname">{tag}</span><span class="tagcount">{count}</span></a>[/list]

где

Бонус:
В шаблоне tagscloud.tpl использовать код:

Код:

        <div class="numbertag">
            [list limit="100" sort="count"]<a href="{link}"><span class="tagname">{tag}</span><span class="tagcount">{count}</span></a>[/list]
        </div>

В шаблоне fullstory.tpl код:

Код:

<div class="finetags">{tags=''}</div>

Спойлер: Стили CSS

Код:

.numbertag a,
.finetags a{
    box-sizing: border-box;
    display: inline-block;
    height: 27px;
    border: 1px solid #d4d4d4;
    border-bottom-color: #c7c7c7;
    border-radius: 3px 0 0 3px;
    box-shadow: 0 1px 3px rgba(0,0,0,.3);
    background: #f8f9fa url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAbCAIAAAAyOnIjAAAAGklEQVQImWP48+cPEwMDA9P///8pomEYjzoAdawnBT2E540AAAAASUVORK5CYII=) repeat-x 0 0;
    color: #222;
    font: bold 12px/25px 'Trebuchet MS',Tahoma,sans-serif;
    text-decoration: none;
    padding: 0;
    position: relative;
    margin:0 15px 11px 0;
}
.finetags a{
    padding: 0 15px;
}
.numbertag a:hover,
.finetags a:hover{
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAbCAIAAAAyOnIjAAAAGUlEQVQImWP48OEDEwMDAxwzMjJSROMxBwA7vQMmCBtaoAAAAABJRU5ErkJggg==);
}

.numbertag a>span{
    display: inline-block;
    position: relative;
}
.numbertag .tagname{
    padding: 0 15px;
}
.numbertag .tagcount{
    padding: 0 8px;
    font: bold 11px/27px Tahoma;
    color: #fff;
    background: #db5a0f url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAbCAIAAAAyOnIjAAAAJUlEQVQImWP4Xm/HxMDAwPT37x8mBgYGpn9//0JpKP8fGp98eQBJnih8eyJnCAAAAABJRU5ErkJggg==) repeat-x 0 0;
}

.tagcount:after,
.tagcount:before,
.finetags a:after,
.finetags a:before{
    content: "";
    display: block;
    left: 100%;
    top: 0;
    position: absolute;
    width: 5px;
    height: 27px;
}
.finetags a:after{
    margin-left: -4px;
}
.finetags a:before{
    margin-left: 1px;
}
.tagcount:before{
    left: -5px;
}
.tagcount:before,
.finetags a:after{
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAbCAYAAAC0s0UOAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAANVJREFUeNqMUksKwjAUfEmjtVKpooKgGzeuXXqM4sKt4KpH8g5uPIF4IJeiiO0bXyqCTSKY8AIZ5n1mEgWAPuu8W2IxSkhTYDVA2A0XhAXZSa9BuEz2mbYe+C+msMBuIwowu5GiSGY1h/V8lcW6GCYmn6QRdQyRMQrFINbbcaIFUJIqTKHnsRRpKZCqu4vMkvl4Lyt6SFT8bmTksr/cQMxR3o91lra1ZHz5edrMMO2Z5kjXZ0Vl5SliX5GVyZ52ClqHXy4h5BJ85+1hmg/HEir8GV4CDAA2PYgOGBxM/AAAAABJRU5ErkJggg==) no-repeat;
}
.tagcount:after,
.finetags a:before{
    width: 3px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAAbCAYAAAC5rTVJAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAANRJREFUeNpifFpm+Z8BCliEOFgY4Jz///8z/APK/fjzj4Hp//9/DN9//2kUbj/KyPCl2vI/SBaEwTKvyswaQHoYP1WY/Qfp+QnUwwKSYQSKggxl+f/vHwNMBqznB9A0if7zjAzvivRQTXuapw0x7XW+FsS0v/8gBoBNY2KAGA2RAer59+8v2G3y028xMjzLUEQ17W6KPMS0J6my/2F6WP4BTQMBdgzTwG7787dRfeFzRob78WKopl2LFoGYdjdWGGEaA1AGaBADJzPQtPc//sEDESDAAKhfo4cJlrA+AAAAAElFTkSuQmCC) no-repeat;
}

Пример работы можно посмотреть на сайте http://color.sandev.pro/tags/

Автор: http://sandev.pro/web/102-kastomizaciya-oblaka-tegov.html

С уважением,
Олег Александрович a.k.a. Sander