Настройка модуля переключения языков

Тема в разделе "Изменение шаблона (кастомизация)", создана пользователем intermed, 05.12.2016.

  1. intermed
    Offline

    intermed Недавно здесь

    Регистрация:
    05.12.2016
    Сообщения:
    2
    Симпатии:
    0
    В модуле переключения языков значки языков по-умолчанию расставляются с зазором в 4 пиксела по горизонтали, пример: upload_2016-12-5_20-59-21.png .
    Подскажите, плиз, как убрать этот зазор?
    И второй вопрос: по-умолчанию значки не реагируют на наведение мыши. Как сделать так, чтобы в пассивном состоянии у значка была одна картинка, а при наведении мыши менялась бы на другую?
     
  2.  
  3. Offline

    Гонсалес Пользователь

    Регистрация:
    25.10.2016
    Сообщения:
    64
    Симпатии:
    4
    Пол:
    Мужской
    Думаю надо в стили лезть, копаться. В частности посмотреть какие у данных элементов значения padding и margin. Если они конкретно у них не прописаны, то прописать.
    2-й вопрос видимо псевдоклассом hover решается: https://webref.ru/css/hover
     
  4. intermed
    Offline

    intermed Недавно здесь

    Регистрация:
    05.12.2016
    Сообщения:
    2
    Симпатии:
    0
    Из интернета нашел, что стиль редактируется в файле \media\mod_languages\css\template.css (исходный код такой):
    Код (css):
    1. div.mod-languages ul {
    2.     margin: 0;
    3.     padding: 0;
    4.     list-style:none;
    5. }
    6. div.mod-languages li {
    7.     margin-left: 5px;
    8.     margin-right: 5px;
    9. }
    10.  
    11. div.mod-languages ul.lang-inline li {
    12.     display:inline;
    13. }
    14.  
    15. div.mod-languages ul.lang-block li {
    16.     display:block;
    17. }
    18.  
    19. div.mod-languages img {
    20.     border:none;
    21. }
    22.  
    23. div.mod-languages a {
    24.     text-decoration: none;
    25. }


    я заменил его на такой:
    Код (css):
    1. div.mod-languages ul {
    2.     margin: 0;
    3.     padding: 0;
    4.     list-style:none;
    5. }
    6. div.mod-languages li {
    7.     margin-left: 0px;
    8.     margin-right: 0px;
    9. }
    10.  
    11. div.mod-languages li.lang-active {
    12.     margin-left: 0px;
    13.     margin-right: 0px;
    14. }
    15.  
    16. div.mod-languages ul.lang-inline li {
    17.     display:inline;
    18.     margin-left: 0px;
    19.     margin-right: 0px;
    20. }
    21.  
    22. div.mod-languages ul.lang-block li {
    23.     display:block;
    24.     margin-left: 0px;
    25.     margin-right: 0px;
    26. }
    27.  
    28. div.mod-languages img {
    29.     border:none;
    30.     margin-left: 0px;
    31.     margin-right: 0px;
    32.     hspace: 0px;
    33.     vspace: 0px;
    34.  
    35.  
    36. }
    37.  
    38. div.mod-languages a {
    39.     text-decoration: none;
    40.     margin-left: 0px;
    41.     margin-right: 0px;
    42. }
    43.  
    44. div.mod-languages a:hover {
    45. border: 2px solid #f00; // Устанавливаем красную рамку
    46.     text-decoration: none;
    47.     margin-left: 0px;
    48.     margin-right: 0px;
    49. }


    и максимум чего добился, это красной рамки при наведении на значок языка, при этом рамка не соответствует значку ( upload_2016-12-6_21-21-45.png )

    Подмена .gif значков языков по-умолчанию на нужные мне .jpg выполняется редактированием файла modules\mod_languages\tmpl\default.php. Вот его текст, в котором ".gif" подменен на ".jpg" (строчка 34):
    Код (PHP):
    1. <?php
    2. /**
    3.  * @package        Joomla.Site
    4.  * @subpackage    mod_languages
    5.  * @copyright    Copyright (C) 2005 - 2013 Open Source Matters, Inc. All rights reserved.
    6.  * @license        GNU General Public License version 2 or later; see LICENSE.txt
    7.  */
    8.  
    9. // no direct access
    10. defined('_JEXEC') or die('Restricted access');
    11. JHtml::_('stylesheet', 'mod_languages/template.css', array(), true);
    12. ?>
    13. <div class="mod-languages<?php echo $moduleclass_sfx ?>">
    14. <?php if ($headerText) : ?>
    15.     <div class="pretext"><p><?php echo $headerText; ?></p></div>
    16. <?php endif; ?>
    17.  
    18. <?php if ($params->get('dropdown', 1)) : ?>
    19.     <form name="lang" method="post" action="<?php echo htmlspecialchars(JURI::current()); ?>">
    20.     <select class="inputbox" onchange="document.location.replace(this.value);" >
    21.     <?php foreach($list as $language):?>
    22.         <option dir=<?php echo JLanguage::getInstance($language->lang_code)->isRTL() ? '"rtl"' : '"ltr"'?> value="<?php echo $language->link;?>" <?php echo $language->active ? 'selected="selected"' : ''?>>
    23.         <?php echo $language->title_native;?></option>
    24.     <?php endforeach; ?>
    25.     </select>
    26.     </form>
    27. <?php else : ?>
    28.     <ul class="<?php echo $params->get('inline', 1) ? 'lang-inline' : 'lang-block';?>">
    29.     <?php foreach($list as $language):?>
    30.         <?php if ($params->get('show_active', 0) || !$language->active):?>
    31.             <li class="<?php echo $language->active ? 'lang-active' : '';?>" dir="<?php echo JLanguage::getInstance($language->lang_code)->isRTL() ? 'rtl' : 'ltr' ?>">
    32.             <a href="<?php echo $language->link;?>">
    33.             <?php if ($params->get('image', 1)):?>
    34.                 <?php echo JHtml::_('image', 'mod_languages/'.$language->image.'.jpg', $language->title_native, array('title'=>$language->title_native), true);?>
    35.             <?php else : ?>
    36.                 <?php echo $params->get('full_name', 1) ? $language->title_native : strtoupper($language->sef);?>
    37.             <?php endif; ?>
    38.             </a>
    39.             </li>
    40.         <?php endif;?>
    41.     <?php endforeach;?>
    42.     </ul>
    43. <?php endif; ?>
    44.  
    45. <?php if ($footerText) : ?>
    46.     <div class="posttext"><p><?php echo $footerText; ?></p></div>
    47. <?php endif; ?>
    48. </div>


    Подскажите, плиз, как отредактировать эти файлы, чтобы получить то, что написано в первом моем сообщении.
     
  5. OlegK
    Offline

    OlegK Russian Joomla! Team Команда форума ⇒ Профи ⇐

    Регистрация:
    17.01.2011
    Сообщения:
    7 813
    Симпатии:
    771
    Пол:
    Мужской
    У тебя в модуле прописан вывод картинок,а не в стилях фоном картинка,которую можно заменить :hover .
    Копай в сторону переопределения шаблона модуля и потом яваскрипт или jquery, для замены картинки.
     

Поделиться этой страницей

Загрузка...