Перейти к содержанию

виджеты социалок на форум


kovboi

Рекомендуемые сообщения

привет всем

увидел на одном сайте (не IPB) сделан совместный блок виджетов в контакте и фесбук (скрин)

как такое можно сделать на форуме?

хотелось бы в боковую панель вставить

спасибо

post-279-0-07216100-1376872969.jpg

Ссылка на комментарий
Поделиться на другие сайты

Ну это т.н. табы (tabs, вкладки), как правило на qwery/ если набрать в поиске tabs qwery вариантов покажет море.

вот эти я у себя на сайте испльзую на главной tab.zip

Ссылка на комментарий
Поделиться на другие сайты

Был хук такой с двумя табами: посл сообщения и темы. Можно его переделать, но, я думаю проще будет самому в кастом боковой блок добавить скрипт с табами, как описано выше.

Ссылка на комментарий
Поделиться на другие сайты

спасибо

сейчас гляну



объясните с установкой если можно

спасибо

Ссылка на комментарий
Поделиться на другие сайты


объясните с установкой если можно
а чего там объяснять, там все в файле как дважды два.
Ссылка на комментарий
Поделиться на другие сайты

kgb, как я понял, код index.html  можно вставить в дополнительный блок соответствующего компонента с указанием директорий скриптов и таблицы стилей. так?

или же просто добавить в глобальный шаблон слегка изменённый код index.html

 

:think:

Ссылка на комментарий
Поделиться на другие сайты

открываем index.html из архива.

видим



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "__www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="__www.w3.org/1999/xhtml">
<head>
<title>Табы</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<script type="text/javascript" src="js/jquery.min.js"></script>
	<script type="text/javascript" src="js/tabs.js"></script>
	<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<body>
<div class="section">
	<ul class="tabs">
		<li class="current">Первая вкладка</li>
		<li>Вторая вкладка</li>
	</ul>
	<div class="box visible">1111111111</div>
	<div class="box">2222222222222222</div>
</div>
</body>
</html>

это всего лишь образец

переходим к форуму.

открываем  globalTemplate

где нибудь до </head>   прописываем  

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>

 

!!! эта строкак вместо  <script type="text/javascript" src="js/jquery.min.js"></script> из приведенного выше образца.  Т.е. jquery.min.js мы берем сразу с гугла, да еще последнюю версию, а не со своего сервера.

 

Ниже прописываем  <script type="text/javascript" src="ваш_урл_до_этого_файла/tabs.js"></script>. Например, если вы его положили в директорию /forum/public/js/ то получиться 

<script type="text/javascript" src="__vashforum.ru/public/js/tabs.js"></script> или  можно проще <script type='text/javascript' src='{$this->settings['js_base_url']}js/tabs.js'></script>

 

далее создаем custom block и вносим  в него 



<div class="section">
	<ul class="tabs">
		<li class="current">Мы вконтакте</li>
		<li>Мы в фейсбук</li>
	</ul>
	<div class="box visible">Код вконтакте</div>
	<div class="box">Код фейсбук</div>
</div>

далее открываем  ipb_styles.css и внизу добавляем код из  style.css , разумеется отредактировав css так как вам надо.

 

Но. если вы не знаете css ? извините, ничем помочь не могу

Изменено пользователем kgb
Ссылка на комментарий
Поделиться на другие сайты

Присоединяйтесь к обсуждению

Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.
Примечание: Ваш пост будет проверен модератором, прежде чем станет видимым.

Гость
Ответить в этой теме...

×   Вставлено с форматированием.   Вставить как обычный текст

  Разрешено использовать не более 75 эмодзи.

×   Ваша ссылка была автоматически встроена.   Отображать как обычную ссылку

×   Ваш предыдущий контент был восстановлен.   Очистить редактор

×   Вы не можете вставлять изображения напрямую. Загружайте или вставляйте изображения по ссылке.

  • Последние посетители   0 пользователей онлайн

    • Ни одного зарегистрированного пользователя не просматривает данную страницу
×
×
  • Создать...