Список вопросов:
  1. Как создать мобильный (фиксированный) блок в Joomla?
  2. Как в JSopping настройка "Товар" загрузить файл с любым расширением?
  3. Как сделать фиксированный фон сайта?
  4. Как сделать бесшовный фон на CSS без использования изображения?
  5. Как вывести ситемное сообщение Joomla?
  6. Как проверить авторизацию пользователя в Joomla?
  7. Как сделать плавное увеличение блоков при наведении курсора?
  8. Как сделать анимацию плавное подчеркивания ссылки при наведении?
  9. Как убрать код JCaption и отключить неиспльзуемые скрипты Joomla?
10. Как сделать плавную прокрутку контента по ссылке к выбранному блоку?
11. Зачем в папках плагинов и модулей Joomla файл index.html?
12. Как сделать плавное открытие страницы сайта после загрузки?
13. Как остаться на той же странице сайта после отправки формы?
14. Белый экран при попытке входа в админку Joomla, что делать?
Ответ на вопрос №1
      Создание мобильного (фиксированного) блока в Joomla. Для начала нужно определиться, где именно на сайте будет располагаться блок. Допустим, это будет позиция для размещения строки поиска и вывода интерактивной корзины JShopping. Переходим по адресу \ваш сайт\templates\ваш шаблон\index.php\, открываем файл index.php и после открывающего тега <body> вставляем седующий скрипт:
<div class="poisk">
    <jdoc:include type="modules" name="poisk" style="none" />
</div>
     После того как определились с позицией (poisk), прописываем стили блока. Для этого переходим по адресу \ваш сайт\templates\ваш шаблон\css\template.css\, открываем файл template.css и в конце файла прописываем следующие стили (отступы и ширину блока можно изменить):
.poisk {
    position: fixed; 
    top: 0; 
    margin: 0 auto; 
    margin: 10px 0px 0px 15px; /* внешние отступы блока */
    padding: 0; 
    list-style: none; 
    height: auto; 
    width: 550px; /* ширина блока */
}
     В дальнейшем для отображения модуля в настройках прописываем позицию poisk (не выбираем, а именно прописываем в поле). Аналогично блок можно разместить в любом месте Вашего сайта.
Ответ на вопрос №2
      В настроках JShopping "Товар" для опции "Файлы" существует ограничение загрузки файлов по расширению. Иногда бывает необходимо загрузить файл с любым расширением (например .html). Вопрос решается просто, переходим по адресу \ваш сайт\components\com_jshopping\lib\uploadfile.class.php\, открываем файл uploadfile.class.php, ищем строку:
var $forbid_file = array('php','php2','php3','php4','php5','js','html','dbf'); //у меня строка №49
     Удаляем расширения файлов, которые хотим загружать.
Ответ на вопрос №3
      При разработке WEB проекта, одним из элементов дизайна является фон сайта. Пользователи могут зайти на Ваш ресурс с различных устройств (компьютеры, гаджеты), которые имеют разное разрешение, формат и масштаб экрана. Поэтому у разных пользователей Ваш сайт будет выглядеть по разному. Отимальным решением является зафиксировать фон сайта, тогда он будет одинаковым на любых устройствах. Для этого переходим по адресу \ваш сайт\templates\ваш шаблон\css\template.css\, открываем файл template.css и в конце файла прописываем следующие стили: 
html {
    background: url(bg.jpg) no-repeat center center fixed;
    /* bg.jpg - фоновое изображение сайта */
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
     Фоновое изображение будет находиться по адресу \ваш сайт\templates\ваш шаблон\css\, т.е. в той же дирректории. Оптимальный размер изображения 1600px на 1200px.
Ответ на вопрос №4
      Для создания фона сайта или блока не обязательно использовать изображения. Можно обойтись исключительно стилями CSS3. Создаем фон плетенка, пишем следующее: 
div {
 background: linear-gradient(45deg, #dca 12%, transparent 0, transparent        88%, #dca 0), linear-gradient(135deg, transparent 37%, #a85 0, #a85 63%, transparent 0), linear-gradient(45deg, transparent 37%, #dca 0, #dca 63%, transparent 0) #753;
 background-size: 25px 25px;
}
     Пример работы стилей фона в блоке ниже... 






Ответ на вопрос №5

       
Системные сообщения Joomla выводятся с помощью конструкции <jdoc:include type="message" /> в файле index.php по адресу \ваш сайт\templates\ваш шаблон\index.php\. В процессе разработки сайта, иногда требуется вывести свое системное сообщение, которое не предусмотрено в Joomla. Для этого, в условие, при выполнении которого должно выводится сообщение, достаточно вставить следующий скрипт:

<?php
JFactory::getApplication()->enqueueMessage('здесь текст сообщения', 'message');
?>







Ответ на вопрос №6

       
Часто при работе c Joomla возникает необходимость проверки условия авторизации пользователя. Реализовать проверку можно следующим скриптом:  

<?php $user = JFactory::getUser();
      if ($user->get('guest') == 0){?>
        <div>Текст №1</div>
      <?php }else{?>
        <div>Текст №2</div>
<?php } ?>     




  


Ответ на вопрос №7

       
Для привлечение аудитории пользователей важно, чтобы дизайн WEB пректа был эффектным. Стили CSS3 позволяют испльзовать анимацию при наведении курсора на блок HTML в котором можно разместить изображение или  текст. Эффект увеличение блока при наведении курсора можно реализовать следующими стилями: 

<div class="block"><img src="URL"></div>
.block {
    overflow:hidden;
}
.block img {
   width: 80%;
  -moz-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  -webkit-transition: all 0.5s ease-out;
   transition: all 0.5s ease-out;
}
.block img:hover {
  -webkit-transform: scale(1.3);
  -moz-transform: scale(1.3);
  -o-transform: scale(1.3);
   transform: scale(1.3);
}

     Пример работы стилей на странице "Скачать".


  


Ответ на вопрос №8

       
Еще одним применением стилей CSS3 является организация анимации подчеркивания ссылки при наведении курсора. Эффект достигается следующими стилями:

a {
    text-decoration: none;
    cursor: pointer;
    position: relative;
}
a:after {
    background-color: #002b41;
    display: block;
    content: "";
    height: 1px;
    width: 0;
    left: 0;
    bottom: 0;
    position: absolute;
    -webkit-transition: width 0.5s;
    -moz--transition: width 0.5s;
    transition: width 0.5s;
}
a:hover:after {
    width: 100%;
}


     Наведите курсор на ссылку для проверки работы стилей   Пример работы стилей


   


Ответ на вопрос №9

       
В процессе WEB разработки наступает время, когда возникает вопрос оптимизации сайта. Специфика Joomla такова, что эта платформа универсальна, и многие файлы, не используясь, загружаются автоматически. Есть несколько способов оптимизации:

     1. Блокируем неиспользуемые скрипты, для этого заходим по адресу \ваш сайт\templates\ваш шаблон\ и открываем файл index.php и в самом верху после строчки defined('_JEXEC') or die; пишем следующий скрипт...

$document = JFactory::getDocument();
unset (
$this->_scripts[$this->baseurl.'/media/system/js/core.js'],
$this->_scripts[$this->baseurl.'/media/system/js/mootools-core.js'],
$this->_scripts[$this->baseurl.'/media/jui/js/jquery-migrate.min.js']
);


     Адреса блокировки для каждого сайта индивидуальны (приведенный скрипт просто пример). Проверить, какой адрес блокировать, можно просто "методом тыка" отключив скрипт и, если сайт работает, значит угадали...

     2. Блокировка кода JCaption в теге <head>. Если открыть любую страницу сайта Joomla и в режиме браузера исходный код страницы в теге <head> можно увидеть следующий скрипт...

<script type="text/javascript">
jQuery(window).on('load',  function() {
                new JCaption('img.caption');
            });
</script>


     Этот скрипт Joomla загружает автоматически на каждой странице и он тормозит работу сайта, чтобы избавиться от этой проблемы, заходим по адресу \ваш сайт\libraries\cms\html\ открываем файл behavior.php находим и комментируем (блокируем) следующие строки...

//JHtml::_('script', 'system/caption.js', array('version' => 'auto', 'relative' => true));
// Attach caption to document
/*JFactory::getDocument()->addScriptDeclaration(
  "jQuery(window).on('load',  function() {
	 new JCaption('" . $selector . "');
 });"
);*/


     В Joomla 3.0 строка №119 (примерно). При этом убирается не только ненужный скрипт, но и блокируется загрузка файла caption.js, который, как показывает практика, не влияет на работу сайта.





Ответ на вопрос №10

       
Для того чтобы сделать плавную прокрутку контента по ссылке к выбранному блоку, в начале страницы материал Joomla пишем следующий скрипт...

<script type="text/javascript">
$(document).ready(function(){
   $("a").click(function () {
	elementClick = $(this).attr("href");
	destination = $(elementClick).offset().top-53;
	$("html,body").animate({scrollTop: destination }, 1000);
  });
});
</script>


далее прописываем ссылку и блок, к которому будем делать плавную прокрутку по контенту...

<a href="#text">Название статьи...</a> 

<div id="text">
........................         
</div>


     Пример работы скрипта можно увидеть на этой странице, кликнув по ссылке вопроса.





Ответ на вопрос №11

       
Многие наверное замечали, что если открыть любую папку плагина или модуля в Joomla, то в ней почти наверняка найдется файл index.html. Если его открыть в редакторе, то обнаружится, что он практически пуст и не несет никакой нагрузки.

     Возникает логичный вопрос зачем этот файл? На самом деле это своеобразная заглушка, которая блокирует доступ к просмотру содержимого рабочих папок Joomla.

     Теоретически, можно удалить все пустые index.html, тем самым освободив место на хостинге, но тогда любой пользователь может увидеть файлы в рабочих папках сайта. Есть способ избежать несанкционированого доступа при отсутствии файла index.html. Для этого в корневой дирректории сайта найдите файл htaccess.txt и переименуйте его (предварительно убрав в свойствах файла "только для чтения") в .htaccess, после чего откройте и вставьте следующий код Options All -Indexes.





Ответ на вопрос №12

       
За частую при загрузке страницы сайта возникает ситуация, когда скрипты и стили грузятся не равномерно из за этого возникают деффекты (смещение и динамика изображения). Есть несколько способов сделать плавное открытие страницы после загрузки рассмотрим два из них:

     Способ 1. Планое открытие страницы с помощью JS. По адресу \ваш сайт\templates\ваш шаблон\index.php\, откройте файл index.php найдите открывающие теги <html>, <body> и добавьте в них код...

<html ............... style="display:none;">
<body ............... onload="$('html').fadeIn(700);">

</body>
</html>


Как альтернативный вариант в файле  index.php перед закрывающим тегом </head> пропишите стиль... 

<style>
body {visibility: hidden;}
</style>

  
а в теге <body> добавьте следующий код...

<body ............... onload="setTimeout ('document.body.style.visibility = \'visible\'', 200)">

</body>  

  
     Способ 2. Планое открытие страницы с помощью CSS3. По адресу \ваш сайт\templates\ваш шаблон\css\templates.css\, откройте файл templates.css и в самом начале вставьте стили...

@-webkit-keyframes fade-in { 0% { opacity: 0.1; } 100% { opacity: 1; } }
@-moz-keyframes fade-in { 0% { opacity: 0.1; } 100% { opacity: 1; } }
@-o-keyframes fade-in { 0% { opacity: 0.1; } 100% { opacity: 1; } }
@keyframes fade-in { 0% { opacity: 0.1; } 100% { opacity: 1; } }

body {
   -webkit-animation: fade-in 1.7s linear;  /*Safari 4+ */
   -moz-animation: fade-in 1.7s linear;  /*Fx 5+ */
   -o-animation: fade-in 1.7s linear;  /*Opera 12+ */
    animation: fade-in 1.7s linear;  /*IE 10+, Fx 29+ */
}  


Еще, как вариант, можно воспользоваться внешним файлом стилей, вставив перед закрывающим тегом </head> ссылку <link rel='stylesheet' id='custom-style-css' href='http://zornet.ru/Aben/ABGEA/FT/rynud/animations.css' type='text/css' media='all' />, а в теге <body> прописать class="fadeIn".
  




Ответ на вопрос №13

       
Часто перед разработчиком WEB проекта возникает вопрос, как оставить пользователя на той же странице сайта после отправки формы. Вашему вниманию предлагается оригинальное и простое решение (без использования JS и PHP) только c помощью атрибута target и скрытого тега iframe. 

<form action="скрипт обработчик" target="имя фрейма">
...............
<input type="type="submit"" name="text" value="отправить">
</form>
<iframe name="имя фрейма" src="file.php" style="display:none;"></iframe>

/*или можно добавить небольшой скрипт JS*/

<form action="скрипт обработчик" onsubmit="this.setAttribute('target','имя фрейма')">
...............
<input type="type="submit"" name="text" value="отправить">
</form>
<iframe name="имя фрейма" id="имя фрейма" onload="передаем содержимое в объкет" style="display:none;"></iframe> 


После отправки формы, скрипт обработчик отправит ссылку в скрытый iframe, а пользователь останется на той же странице.





Ответ на вопрос №14

       
Иногда перед разработчиком WEB проекта Joomla возникает проблема, которая заключается в невозможности зайти в администрацию сайта, система выдает пустой белый экран. Одной из возможных причин ошибки может быть не соответствие текущей даты с датами, указанными в файле phpversioncheck.php. Проблема решается просто: по адресу \ваш сайт\plugins\quickicon\phpversioncheck\phpversioncheck.php открываем файл и редактируем строку (примерно № 134), меняем конечную дату года ('eos'), например с '2020-11-30' на '2025-11-30'.