Время от времени возникает необходимость отключить сайт для проведения профилактических работ по обновлению скриптов. В движке ДЛЕ для этого есть специальный шаблон, позволяющий выводить статическую информацию для посетителей, при этом авторизованные администраторы сайта могут видеть его "во всей красе". В данной статье мы расскажем о том, как использовать шаблон заглушки с пользой для своего сайта.
Заглушка на время разработки сайта
Для начала определимся, что происходит в момент отключения сайта.Доступ к вашим страницах закрыт, посетители, пришедшие с поисковиков видят некую заглушку, а не запрашиваемую информацию.
Постоянные читатели вместо привычных лент с новостями остаются без свежего контента.
Клиенты интернет-магазина или любой иной коммерческой организации не могут найти и получить контактные данные вашей организации.
Что из этого следует?Необходимо на статической странице заглушки дать минимум необходимой информацию посетителям. Мы должны сообщить причины отключения сайта, при необходимости указать контактные данные (если являемся коммерческой организацией и сайт для нас - это источник поступления клиентов), оставить интерактивный способ связи. Если наш сайт новостной портал или блог - вывести ленту новостей.
Способы реализацииВ движке DLE шаблон оффлайн страницы представляет собой стандартный html файл + пара спец.тегов, так что вся описанная информация будет актуальна и для любых других сайтов, использующих html.
1. Нам необходим логотип (думаю этот факт является бесспорным).
2. Служебная информация, объясняющая посетителям что тут собственно происходит.
Для DLE указать причину отключения сайта можно непосредственно в админке - в разделе
Общие настройки3. При неработающем сайте хорошей идеей выглядит установка на заглушку онлайн консультанта.
Мы рекомендуем использовать бесплатный сервис
http://sitehelp.inkiev.net/SiteHelp - это система онлайн чата, основное предназначение которой максимально быстро и без дополнительных действий пообщаться с оператором/поддержкой/консультантом/продавцом сайта, на котором вы находитесь.
Общайтесь с посетителями вашего сайта максимально быстро, просто и бесплатно.
4. Если у вашего сайта есть Твиттер - обязательно установите виджет для информирования посетителей о ваших работах.
Лента твитов и онлайн консультант идеальный вариант для проекта, над которым принялись работать, но до готовности самого сайта еще не одна неделя. А иметь обратную связь с посетителями необходимо уже сейчас.
Код для виджета вашей ленты твитов можно получить на странице
http://twitter.com/about/resources/widgetsВсё что требуется - указать на
этой странице логин своего тивттера
Затем настроить внешний вид виджета и получить готовый код для встраивания на свой сайт.
Если твиттер для вас слишком лаконичен, а свои гениальные мысли вы привыкли озвучивать по средствам IM клиентов на основе джаббер, хорошей альтернативой станет виджет для микроблог сервиса
Джуйкисходный код html страницы для джуйка
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><title>Мой блог</title><script src="juick.js" type="text/javascript"></script><script type="text/javascript">Date.prototype.getMonthName = function() { return ['Января','Февраля','Марта','Апреля','Мая','Июня','Июля','Августа','Сентября','Октября','Ноября','Декабря'][this.getMonth()];}var juickReplies="Ответов";var juickNewer="< Раньше";var juickOlder="Позже >";var juickID=1;</script><style type="text/css">body { width: 512px; margin: 0 auto; font-family: sans-serif; }h1 { background: #F0F0F0; border-bottom: 1px solid #CCC; margin: 0 0 1em 0; padding: 0.5em; }img { border: 0; }a { color: #00C; }a:visited { color: #00C; }h1 a { color: #000; text-decoration: none; }h1 a:visited { color: #000; }#messages { list-style-type: none; margin: 0; padding: 0; }#messages li { margin-bottom: 2.5em; }#messages .date { float: left; width: 6em; margin-left: -8em; text-align: center; color: #999; }#messages .day { font-size: x-large; }#messages .photo { text-align: center; }#messages .text { margin: 0.5em 0; }#messages .replies { text-align: right; }#messages .tags { list-style-type: none; margin: 0 0 0 1em; padding: 0; float: left; }#messages .tags li { display: inline; margin-right: 0.5em; }#messages .tags a { color: #999; text-decoration: none; border-bottom: 1px dashed #999; }#replies { list-style-type: none; margin: 0; padding: 0; }#replies li { margin-bottom: 2.5em; background-repeat: no-repeat; padding-left: 42px; }#replies .username { font-size: larger; }#navigation { background: #F0F0F0; margin: 2em 0; padding: 5px; text-align: center; }#footer { margin: 2em 0 0 0; padding: 5px; font-size: small; text-align: center; }#footer a { color: #999; }</style></head><body onload="juickInit(23401)" onhashchange="juickInit(23401)"><h1><a href="#">Ваш блог - имя компании</a></h1><ul id="messages"></ul><div id="navigation"></div><ul id="replies"></ul><div id="footer"><a href="http://juick.com/">Juick</a></div></body></html>
var juickTag;var juickPage;function juickInit(uid) { var message=juickGetHashVar("message"); juickTag=juickGetHashVar("tag"); juickPage=juickGetHashVar("page"); if(juickPage) juickPage=parseInt(juickPage); if(!juickPage || juickPage<1) juickPage=1; var msgs=document.getElementById("messages"); while(msgs.hasChildNodes()) msgs.removeChild(msgs.lastChild); var replies=document.getElementById("replies"); while(replies.hasChildNodes()) replies.removeChild(replies.lastChild); document.getElementById("navigation").style.display="none"; var nodes=document.getElementsByClassName("loadScript"); for(var i=0; i<nodes.length; i++) nodes[i].parentNode.removeChild(nodes[i]); if(message && message>0) { var url="http://api.juick.com/thread?mid="+message+"&callback=juickParseThread"; juickLoadScript(url); } else { var url="http://api.juick.com/messages?user_id="+uid; if(juickTag && juickTag!='') url+="&tag="+encodeURI(juickTag); if(juickPage && juickPage>0) url+="&page="+juickPage; url+="&callback=juickParseMessages"; juickLoadScript(url); }}function juickLoadScript(src) { var scripttag=document.createElement("script"); scripttag.setAttribute("type","text/javascript"); scripttag.setAttribute("src",src); scripttag.setAttribute("class","loadScript"); document.getElementsByTagName("head")[0].appendChild(scripttag); }function juickParseMessages(json) { var msgs=document.getElementById("messages"); for(var i=0; i<json.length; i++) { var ts=json[i].timestamp.split(/[-s]/); var date=new Date(ts[0],ts[1]-1,ts[2]); var ihtml='<div class="date"><div class="day">'+date.getDate()+'</div><div class="month">'+date.getMonthName()+'</div></div>'; ihtml+='<div class="text">'; if(json[i].photo) ihtml+='<div class="photo"><a href="'+json[i].photo.medium+'"><img src="'+json[i].photo.small+'" alt="Photo"/></a></div>'; if(json[i].video) ihtml+='<b>Attachment:</b> <a href="'+json[i].video.mp4+'">Video</a><br/>'; if(json[i].location) ihtml+='<b>Location:</b> <a href="/places/'+json[i].location.place_id+'">'+json[i].location.name+'</a><br/>'; ihtml+=juickFormatText(json[i].body); ihtml+='</div>'; if(json[i].tags) { ihtml+='<ul class="tags">'; for(var n=0; n<json[i].tags.length; n++) ihtml+='<li><a href="#tag='+json[i].tags[n]+'">'+json[i].tags[n]+'</a></li>'; ihtml+='</ul>'; } var replies=json[i].replies; if(!replies) replies=0; ihtml+='<div class="replies"><a href="#message='+json[i].mid+'">'+juickReplies+': '+replies+'</a></div>'; var li=document.createElement("li"); li.innerHTML=ihtml; msgs.appendChild(li); } var nav=""; if(juickPage && juickPage>1) { nav+='<a href="#'; if(juickTag && juickTag!='') nav+='tag='+juickTag+'&'; if(juickPage>2) nav+='page='+(juickPage-1); nav+='">'+juickNewer+'</a>'; } if(juickPage>1 && json.length==20) nav+=' '; if(json.length==20) { nav+='<a href="#'; if(juickTag && juickTag!='') nav+='tag='+juickTag+'&'; nav+='page='+(juickPage+1); nav+='">'+juickOlder+'</a>'; } if(nav!="") { document.getElementById("navigation").innerHTML=nav; document.getElementById("navigation").style.display="block"; }}function juickParseThread(json) { var msg=new Array(); msg[0]=json[0]; juickParseMessages(msg); var replies=document.getElementById("replies"); for(var i=1; i<json.length; i++) { var ihtml='<div class="username"><a href="http://juick.com/'+json[i].user.uname+'/">@'+json[i].user.uname+'</a>:</div>'; ihtml+='<div class="text">'; if(json[i].photo) ihtml+='<div class="photo"><a href="'+json[i].photo.medium+'"><img src="'+json[i].photo.small+'" alt="Photo"/></a></div>'; if(json[i].video) ihtml+='<b>Attachment:</b> <a href="'+json[i].video.mp4+'">Video</a><br/>'; ihtml+=juickFormatText(json[i].body); ihtml+='</div>'; var li=document.createElement("li"); li.style.backgroundImage='url(http://i.juick.com/as/'+json[i].user.uid+'.png)'; li.innerHTML=ihtml; replies.appendChild(li); }}function juickGetHashVar(variable) { var query=window.location.hash.substring(1); var vars=query.split("&"); for(var i=0; i<vars.length; i++) { var pair=vars[i].split("="); if(pair[0]==variable) return pair[1]; }}function juickFormatText(txt) { txt=txt.replace("<","<").replace(">",">").replace(""","""); txt=txt.replace(/n/g,"<br/>"); return txt;}
Обратите внимание:чтобы транслировать в виджет записи, Вам необходимо иметь страницу в сервисе Джуйк.
А для того, чтобы получить свой juickInit необходимо в своем профиле в свойствах аватара узнать номер картинки
в данном пример UID моего джуйка 1493
следовательно строка в html файле будет
<body onload="juickInit(1493)" onhashchange="juickInit(1493)">
демо версия такой оффлайн страницы
http://demo.tcse-cms.comНадеюсь данная заметка поможет понять всю пользу заглушек для сайта на время разработки или обновлений.
0 Комментарии