Скрыть объявление
Вышла новая версия XenForo 1.5.11 Nulled By XenForo.Info. Поспешите обновить свои форумы на новую версию прямо сейчас!

Замена ссылок на кликабельные кнопки работы с сообщением

Тема в разделе "Модификации шаблонов и файлов", создана пользователем HellFire, 5 авг 2013.

  1. TopicStarter Overlay
    HellFire

    HellFire Проверенные

    Сообщения:
    1401
    Симпатии:
    834
    Пол:
    Мужской
    Все замечали, что ссылки для работы с сообщениями не очень хорошо выглядят и это создаёт небольшой эстетический дискомфорт т.е. на данный момент выглядит так
    Безымянный.png
    а будет так
    Безымянный.png

    Приступим, пример будет показан на кнопке "Мне нравится":
    1. Админка
    2. Внешний вид
    3. Поиск по фразам-> выбираем язык
    4. Ищем по заголовку "Like" или "Мне нравится" в поиске по фразам
    5. Вставляем вместо "Мне нравится" такой код
    HTML:
    <input type="submit" class="button" value="Спасибо" style="color:#7CFC00; font-weight: bold;" >
    value="Спасибо" это название на кнопке
    style="color:#7CFC00; font-weight: bold;" - цвет, жирный шрифт

    И получается красивая кнопка как на картинке выше, зелёная кнопочка красиво.

    Способ для извращенцев:
    Можно вообще вместо того, что я написал, засобачить картинку
    HTML:
    <img src="ссылка на картинку" alt="Описание, для поисковиков и пользователей" height="Высота в пикселях" width="Ширина в пикселях">
    


    без какого либо CSS и прочего. и будет вместо надписи картинка, но я такой способ не уважаю т.к. картинки имеют гораздо больший вес, чем строка HTML разметки :-)
     
    Последнее редактирование: 6 авг 2013
    Роман_Тютин, kubik, volka и 10 другим нравится это.
  2. Владимир Миронов

    Владимир Миронов Проверенные

    Сообщения:
    1003
    Симпатии:
    714
    Пол:
    Мужской
    Методика полезная. Но вам не кажется, что фразы - это не то место, куда надо вставлять код?
    Притом class="button" означает, что будет применён стиль кнопки, который у каждого стиля свой.
    Стиль, который прописывается в данном коде применяется только для текста.
    Я придерживаюсь того мнения, что если уж делать стиль для кнопок, то надо создавать стиль в css и применять его к коду кнопок как например здесь http://xenforo.info/resources/Изменяем-внешний-вид-кнопки-Ответить.779/
     
    HellFire и Mirovinger нравится это.
  3. TopicStarter Overlay
    HellFire

    HellFire Проверенные

    Сообщения:
    1401
    Симпатии:
    834
    Пол:
    Мужской
    но таким методом вы не прийдёте к этому результату.

    И да, я знаю, что я задаю стиль кнопки по стандарту и только цвет и шрифт меняется внутри.

    Но не кажется ли Вам, что всё-же иметь единообразие, чем безобразие?

    Да, у меня в стиле кнопка ответить как кнопки выше, и они становятся именно такими как в вашем стиле прописаны.

    Т.е. они не выходят из рамок стиля и народ увидит такие кнопки и подумает, что именно так и должно быть.
    И если вы замените стандартный стиль кнопок на другой, кнопки при помощи моего метода изменятся за ними, т.е. не прийдётся ещё кучу кода переписывать и искать "где же там всё таки надо что-то найти".



    Есть ещё круче способ, можно вообще вместо того, что я написал, засобачить картинку без какого либо CSS и прочего. и будет вместо надписи картинка, но я такой способ не уважаю т.к. картинки имеют гораздо больший вес, чем строка HTML разметки :-)





    Первый пост обновлён
     
    Последнее редактирование: 6 авг 2013
  4. Владимир Миронов

    Владимир Миронов Проверенные

    Сообщения:
    1003
    Симпатии:
    714
    Пол:
    Мужской
    с хренов ли? не надо людей вводить в заблуждение. Стиль button сделан на css и вы данным классом просто дублируете стиль на другие кнопки. При помощи css можно задать любой вид кнопок.
    Ваша методика работает, я ничего не говорю, что она не работает. Но повторюсь, что фразы - это вроде не то место, куда следует пихать вместо языка код. При обновлении языка всё придётся делать заново, а extra.css для того и сделана, чтобы при обновлении ничего не улетело.

    эти кнопки вообще то не видны гостям, а значит и ПС не будет их индексировать. Поэтому здесь alt у картинок только для пользователей прописывается.
     
  5. TopicStarter Overlay
    HellFire

    HellFire Проверенные

    Сообщения:
    1401
    Симпатии:
    834
    Пол:
    Мужской
    Я не правильно выразился про "такой результат", мысль больше шла к тому-что кода гораздо меньше

    То, что я предложил более просто и все замены кнопок в сообщениях наверно и половины не будут занимать количества символов.


    На счёт поисковых систем, да я погорячился, с этим спорить не буду.





    P.S. зачем стремиться к громоздкости кода? Ну, да я во фразы запихнул код, но сами посудите, даже если вы обновите язык вы за 1-2 минуты восстановите всё, или ещё лучше сделать самому себе xml с фразами, но это уже другая история.
     
    Mirovinger нравится это.
  6. ЦукерОо

    ЦукерОо Проверенные

    Сообщения:
    214
    Симпатии:
    134
    Пол:
    Мужской
    Разницы вроде не какой нету , куда пихать, сами разработчики бывают суют коды переноса и выделения текста во фразы.
     
    HellFire нравится это.
  7. brainless

    brainless Проверенные

    Сообщения:
    181
    Симпатии:
    97
    Пол:
    Мужской
    сделал себе для пробы,все получилось отлично кроме одного........ кнопки появились везде,где нужно и где они совсем не нужны.......как сделать чтоб кнопки были только под сообщениями в темах?
     
  8. TopicStarter Overlay
    HellFire

    HellFire Проверенные

    Сообщения:
    1401
    Симпатии:
    834
    Пол:
    Мужской
    2 пути:
    1. создать отдельные фразы для этих кнопок и их в шаблоне подменить
    2. не делать так:-)


    Я так понимаю вылезли кнопки редактировать и ответить?)
     
  9. brainless

    brainless Проверенные

    Сообщения:
    181
    Симпатии:
    97
    Пол:
    Мужской
    HellFire, нет......например в менюшке чата, при клике на аву пользователя (у админов и модеров) ...... там где быстрое управление
     
  10. TopicStarter Overlay
    HellFire

    HellFire Проверенные

    Сообщения:
    1401
    Симпатии:
    834
    Пол:
    Мужской
    а там кнопка редактировать :-))


    впринципе 1 вариант тоже хорош, сейчас посмотрю как лучше сделать и напишу гайд.
    Создаём дополнительную фразу, чтоб ваши кнопки были красивыми.

    на примере кнопки редактировать в карте пользователя

    создаём фразу
    upload_2014-1-19_13-52-30.png
    заменяем в шаблоне это
    upload_2014-1-19_13-55-59.png
    на свою фразу
    upload_2014-1-19_13-56-54.png




    Топорный и не оптимизированный метод, гайд сделал на скорую руку.

    Лучше фразу делать не там где лишнее получилось, а на оборот, там где хотите изменить ссылку на кнопку, тогда незадуманные методы будут просто не задеты.
     
    Denel, Hope и Mirovinger нравится это.
  11. mammuthus

    mammuthus Проверенные

    Сообщения:
    8
    Симпатии:
    0
    Пол:
    Мужской
    Я хочу вообще удалить текст с кнопки. Но, если я полностью удаляю текст из фразы, то остается свободное место. Как этого избежать?
     

    Вложения:

  12. Hope

    Hope Администрация

    Сообщения:
    37263
    Симпатии:
    42718
    Пол:
    Мужской
    Так это уже в шаблоне EXTRA.css стиля нужно смотреть и данная тему тут ни при чём...
     
  13. TopicStarter Overlay
    HellFire

    HellFire Проверенные

    Сообщения:
    1401
    Симпатии:
    834
    Пол:
    Мужской
    надо из шаблона вырезатьполностью идентификатор(или как его) фразы, но чую вам потом может выйти боком.
     
    mammuthus нравится это.
  14. Knocks

    Knocks Проверенные

    Сообщения:
    22
    Симпатии:
    10
    Че-то ярко-зеленое "спасибо" не очень смотрится на темно-синей кнопке.
     
  15. monah

    monah Проверенные

    Сообщения:
    64
    Симпатии:
    11
    Пол:
    Мужской
    вот еще одно решение.. добавляем в EXTRA.css
    Код:
        .message .messageMeta .control.edit {
                            background-image: url('путь_к_картинке');
                            background-repeat: no-repeat;
                            background-position: 8px center;
                            padding-left: 30px;
                        }
                       
                        .message .messageMeta .control.delete {
                            background-image: url('путь_к_картинке');
                            background-repeat: no-repeat;
                            background-position: 8px center;
                            padding-left: 30px;
                        }
                       
                        .message .messageMeta .control.ip {
                            background-image: url('путь_к_картинке');
                            background-repeat: no-repeat;
                            background-position: 8px center;
                            padding-left: 30px;
                        }
                       
                        .message .messageMeta .control.warn {
                            background-image: url('путь_к_картинке');
                            background-repeat: no-repeat;
                            background-position: 8px center;
                            padding-left: 30px;
                        }
                       
                        .message .messageMeta .control.report {
                            background-image: url('путь_к_картинке');
                            background-repeat: no-repeat;
                            background-position: 8px center;
                            padding-left: 40px;
                        }
                       
                        .message .messageMeta .control.postNumber {
                            background-image: url('путь_к_картинке');
                            background-repeat: no-repeat;
                            background-position: 8px center;
                            padding-left: 46px;
                        }
                       
                        .message .messageMeta .control.like {
                            background-image: url('путь_к_картинке');
                            background-repeat: no-repeat;
                            background-position: 8px center;
                            padding-left: 30px;
                        }
                       
                        .message .messageMeta .control.reply {
                            background-image: url('путь_к_картинке');
                            background-repeat: no-repeat;
                            background-position: 8px center;
                            padding-left: 30px;
                        }
    только не знаю как добавить картинки к:
    № поста
    Ник в ответ
    Репутация
    Лучший ответ
    История
    Время создания поста
     
    Mirovinger и Hope нравится это.
  16. TopicStarter Overlay
    HellFire

    HellFire Проверенные

    Сообщения:
    1401
    Симпатии:
    834
    Пол:
    Мужской
    Как вариант через фразы
     
  17. monah

    monah Проверенные

    Сообщения:
    64
    Симпатии:
    11
    Пол:
    Мужской
    а как добавить слово "поделиться " сюда Безымянный.png в номер поста?
     
  18. Hope

    Hope Администрация

    Сообщения:
    37263
    Симпатии:
    42718
    Пол:
    Мужской
    Шаблон post:
    Код:
    <a href="{xen:link threads/post-permalink, $thread, 'post={$post}'}" title="{xen:phrase permalink}" class="item muted postNumber hashPermalink OverlayTrigger" data-href="{xen:link posts/permalink, $post}">#{xen:calc '{$post.position} + 1'}</a>
     
    monah и Mirovinger нравится это.
  19. Роман_Тютин

    Роман_Тютин Проверенные

    Сообщения:
    152
    Симпатии:
    59
    Пол:
    Мужской
    HellFire, Спасибо, мне как раз нужно было выделить одну кликабельную ссылку среди других, Ваш вариант идеально подошёл :Good1:
     
www.megastock.ru

Email: XenForo.Info@yandex.ru. Skype: XenForo.Info