Создание на сайте страницы FAQ

Вопросы
Уважаемые пользователи LS! Помогите реализовать на сайте страницу FAQ на подобие ЭТОЙ страницы. Спасибо, буду рад каждому совету и даже платному предложению.

UPD: Вопрос конкретно о дизайне страницы, а не о том, где редактировать собственные страницы.

23 комментария

avatar
Активируй плагин Static page и делай. В чём проблемы то?
avatar
Она активирована само собой, если бы я знал как сделать, то, наверное, не спрашивал бы, здесь, как думаете?
avatar
site/page/admin
avatar
Вы шутите? Зачем мне эта ссылка? Я знаю где страницы редактировать, вы суть вопроса не поняли наверное…
avatar
А может быть вы не правильно задали вопрос?
avatar
Сейчас понятней?
avatar
1. если хотите как там, возьмите HTML и css от туда
2. посмотрите как там реализован тык на ссылки, чтобы появлялись ответы, думаю там строк 10-20 кода js
3. создайте static page, и встройте туда весь HTML код
4. подключите js через config шаблона

конечно не подробно, но план действий таков :)

как бы более подробней можно, но сложно :)
avatar
В текст стат.странички суём:

<div class='qa_item'>
  <div class='question'>
      <div class='num'>1.</div>
         <div class='title'>Как зарегистрироваться?</div>
      </div>
      <div class='answer'>
           <p>Регистрация доступна на <a href='/registration/'>специальной странице</a>.</p>
     </div>
    
</div>


<div class='qa_item'>
  <div class='question'>
      <div class='num'>2.</div>
         <div class='title'>ЧО?</div>
      </div>
      <div class='answer'>
           <p>Ничо!</a>.</p>
     </div>
    
</div>

В /templates/skin/developer/js/template.js
Перед 
ls.hook.run('ls_template_init_end',[],window);

Суём
$(".qa_item").each(function(e,t){$(".question .title",t).click(function(){$(".qa_item .answer").removeClass("open"),$(".answer",t).addClass("open")})});


В css стили:
.qa_item{margin-bottom:20px}
.qa_item .question{color:#555e6c;font-size:15px;font-weight:bold}
.qa_item .question .num{display:inline-block}
.qa_item .question .title{display:inline-block;border-bottom:1px dashed;cursor:pointer}

.answer{
	display:none;
	margin-top:15px;
	padding:10px 15px;
	border:1px solid #e3e3e3;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	text-align:left;
	font-size:13px;
	line-height:20px;
	color:#626262;position:relative}
.qa_item .answer.open{display:inline-block}
.qa_item .answer:after{
	background:url(/assets/comment.arrow-6e9d5d13e94259fb6447e560da67114f.png) no-repeat;
	width:15px;
	height:13px;
	content:"";
	position:absolute;
	left:15px;
	top:-13px}
.qa_item .answer p:first-child{margin-top:0}

Проверил на своём сайте. Работает.
avatar
Супер, спасибо огромное.
avatar
А в стили куда base.css?
avatar
Проверил, все получилось, только рамка в которой ответ дан несколько иная, она просто с закругленными краями, но на freelansim она несколько иная.
avatar
Там тоже закруглено. Только тут ещё:
background:url(/assets/comment.arrow-6e9d5d13e94259fb6447e560da67114f.png) no-repeat;

Слейте картинку freelansim.ru/assets/comment.arrow-6e9d5d13e94259fb6447e560da67114f.png
Закиньте в images и поменяйте путь.
avatar
Какие параметры в css отвечают за ширину рамки ответа, она у меня что-то гораздо шире чем оригинал?
avatar
чего то не раскриваются подразделы!? скин synio
avatar
значит что-то не так сделали… все прекрасно работает.
avatar
Сброс данных делал..., чего то не помогло, потом обновлял админку...., заметил что уже все работает))
avatar
Ребята, а почему у нас расстояние от рамки до нижней строки текста больше чем на том сайте, т.е. у нас текст не по центру по высоте? В css порылся, у нас тоже самое что и на том сайте… Гуру помогите пожалуйста отцентрировать этот текст в рамке.
avatar
Ага, у меня кстати тоже также…
avatar
Потому что в text css видимо указано:
.text p { margin-bottom: 1em; }
avatar
Огромное спасибо добрый человек, я поменял в text.css вот это 
.text p { margin-bottom: 1em; }
на 
.text p { margin-top: 10px; }
и оно сработало!
avatar
10 многовато, теперь разрыв между самим вопросами и блоком ответа до минимума снизошел.
avatar
Нужно еще поковырять… чего то не хватает в наших css. По уму надо бы задать отдельный стиль чисто для этой странички с FAQ, а не менять изначальные стили, которые для всего сайта. ewden помоги еще раз добрый человек. С этими css не так то просто разобраться, там что то наследуется от чего то… черт ногу сломит:)
avatar
Я бы рад помочь, но не знаю чем уже. Может лучше будет вы если что-то конкретно спрашивать будете. В таком случае по мере своих знаний постараюсь подсказать.
Кстати. Хороший и простой способ понять что и откуда наследуется:
На время работы на сайте сделать в конфиге сделать 
$config['compress']['css']['merge'] = false;

А потом использовать «инспектор» фаерфокса. C ним отлично видно, что и куда:
itmages.ru/image/view/883439/a7b8321e
На примере, класс answer определён в base.css 200-ая строка.
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.