Здесь я напишу как можно поменять тему(фоновый вид) на сайте вконтакте
Внимание: темы и скрипты на них можно взять здесь(http://vkontakte.ru/photos.php?act=albu … d=53413918), там же можно посмотреть фото тем.
Изменение темы вконтакте
Страница: 1
Сообщений 1 страница 8 из 8
Поделиться12009-02-22 02:15:16
- Администратор
- Откуда: Питер City
- Зарегистрирован: 2009-02-19
- Приглашений: 0
- Сообщений: 238
- Уважение: +3
- Позитив: +2
- Пол: Мужской
- Возраст: 30 [1994-11-13]
- Провел на форуме:
6 часов 7 минут - Последний визит:
2010-06-14 16:56:02
Поделиться22009-02-22 02:15:57
- Администратор
- Откуда: Питер City
- Зарегистрирован: 2009-02-19
- Приглашений: 0
- Сообщений: 238
- Уважение: +3
- Позитив: +2
- Пол: Мужской
- Возраст: 30 [1994-11-13]
- Провел на форуме:
6 часов 7 минут - Последний визит:
2010-06-14 16:56:02
Для пользователей Explorer
Внимание - под Эксплорером установленные темы применяются ко всем сайтам, не только для vkontakte.ru!
Для корректного отображения других сайтов вам придется выключать тему каждый раз, когда вы переходите на другой сайт, или же установить себе другой браузер (Firefox или Opera) и поставить темки уже на него.
+ побочный эффект - если вы пользуетесь ICQ тема и на неё будет распространяться.
+ еще одна причина уйти от эксплорера: цитата Павла Дурова "Пользуйтесь браузерами FireFox и Opera, сводите к минимуму работу в браузере Internet Explorer." (это он о безопасности)
_____________________________________________________________
Как установить на Explorer:
1. Под фото выбранной темы выделяем и копируем текст каскадной таблицы (в комментариях к выбранной темке)
вот так http://vkontakte.ru/photos.php?act=show&id=-2428...
2. Открываем Блокнот (или др. простой текстовый редактор) и вставляем в него то, что скопировали.
вот так http://vkontakte.ru/photos.php?act=show&id=-2428...
3. В блокноте нажмите "Файл" - "Сохранить как". Впишите название, например vkontakte.css (обязательно с окончанием .css латиницей!)
Укажите папку, куда сохранить файл (неважно куда, лишь бы не потерять, например в папку Program Files или создайте новую) и Сохраните.
вот так http://vkontakte.ru/photos.php?act=show&id=-2428...
4. В эксплорере переходим Cервис( Tools) → Св-ва обозревателя ( internet options) → Общие(General)→ Оформление(Accesibility)
Поставить галочку на "Оформлять,используя пользовательский стиль"(Format documents using my style sheet)
Нажать "Обзор" и открыть там сохраненный файл .css
http://vkontakte.ru/photo-2428795_118816178
http://vkontakte.ru/photo-2428795_118816179
Видео-инструкция:
1 этап. Создание файла css - http://vkontakte.ru/video-2428795_67637475
2 этап. Установка темы - http://vkontakte.ru/video-2428795_67637761
Видео-инструкция от Александра √ιק Lexsi Беляева
http://vkontakte.ru/video-5221092_78165973
Поделиться32009-02-22 02:16:52
- Администратор
- Откуда: Питер City
- Зарегистрирован: 2009-02-19
- Приглашений: 0
- Сообщений: 238
- Уважение: +3
- Позитив: +2
- Пол: Мужской
- Возраст: 30 [1994-11-13]
- Провел на форуме:
6 часов 7 минут - Последний визит:
2010-06-14 16:56:02
Для пользователей Opera
1. Проверьте настройки:
Инструменты/Настройка/Дополнительно/Содержимое/Параметры стиля (или "Настроить стили")/Режимы представлений (или "Режимы отображения").
Слева проверить, чтобы стояла галочка около "Моя таблица стилей"
вот так http://vkontakte.ru/photo-2428795_113098096
2. Под фото выбранной темы выделяем и копируем текст каскадной таблицы (в комментариях)
вот так http://vkontakte.ru/photo-2428795_113103932
3. Открываем Блокнот (или др. простой текстовый редактор) и вставляем в него то, что скопировали.
вот так http://vkontakte.ru/photo-2428795_113097032
4. В блокноте нажмите "Файл" - "Сохранить как". Впишите название, например vkontakte.css (обязательно с окончанием .css латиницей!)
Укажите папку, куда сохранить файл (неважно куда, лишь бы не потерять, например в папку Opera) и Сохраните.
вот так http://vkontakte.ru/photo-2428795_113097419
5. Правой кнопкой мыши щелкните по фону странички Вконтакта и нажмите "Изменить настройки узла"(или "Настройки для сайта")
вот так http://vkontakte.ru/photo-2428795_113097741
6. На вкладке "Отобразить" (или "Вид") нажмите "Обзор", укажите место, где сохранили файл vkontakte.css
И нажмите "Ок". Обновите страницу.
Все!
Видео-инструкция:
1 этап. Создание файла css - http://vkontakte.ru/video-2428795_67637475
2 этап. Установка темы - http://vkontakte.ru/video-2428795_67638293
Чтобы выключить тему, на вкладке "Отобразить" (или "Вид") сотрите путь к файлу и жмите Ок. Обновите страницу.
update: 27/10/2008 подправлены названия пунктов меню для v9.61
update: 19/01/2009
Если у вас не изменяется цвет шрифта в текстовых полях, то...
Меню "Вид" - "Стиль" - "Настроить стили..."
Вкладка "Вид" поставить галку "Включить стилизацию форм"
Поделиться42009-02-22 02:18:04
- Администратор
- Откуда: Питер City
- Зарегистрирован: 2009-02-19
- Приглашений: 0
- Сообщений: 238
- Уважение: +3
- Позитив: +2
- Пол: Мужской
- Возраст: 30 [1994-11-13]
- Провел на форуме:
6 часов 7 минут - Последний визит:
2010-06-14 16:56:02
Для пользователей Mozilla Firefox
1. Установите на FireFox аддон Stylish, перейдя по ссылке и добавив аддон в Firefox и перезапустив браузер.
http://addons.mozilla.org/ru/firefox/addon/2108
2. Под выбранной темой (в альбомах группы) аккуратно скопируйте текст каскадной таблицы
вот так http://vkontakte.ru/photos.php?act=show&id=-2428...
3. В меню Stylish (в правом нижнем углу браузера значёк Stylish(листик с ручкой)) нажмите Создать стиль>Для vkontakte.ru
( Если нет значка, проверьте чтобы была галочка в меню Вид>Строка состояния
вот так http://vkontakte.ru/photos.php?act=show&id=-2428...
4. В появившемся окне в поле "описание" назовите как хотите.
В нижнее окно вставьте текст каскадной таблицы МЕЖДУ узорными скобками { }
вот так http://vkontakte.ru/photos.php?act=show&id=-2428...
5. Жмите Cохранить, теперь можно эту тему включать, выключать, комбинировать несколько тем.
Видео-инструкция - http://vkontakte.ru/video-2428795_67638413
__________________________________________________________
Перед тем как поставить другую тему, желательно отключите предыдущую!!! Иначе они могут отображаться некорректно!
Чтобы выключить тему, снимите с неё галочку в меню Stylish
и обновите страницу. Перечень тем для Вконтакте появляется лишь когда находишься на сайте Вконтакте.
Вы можете создать тему самостоятельно, переписав коды цветов шрифта, ссылок на фоновые картинки, и опубликовать свои темы для всех.
Если вы все сделали, а тема не работает, напишите какая конкретно тема, указав ссылку на неё (некоторые темы могут быть нерабочие).
Поделиться52009-02-22 02:19:39
- Администратор
- Откуда: Питер City
- Зарегистрирован: 2009-02-19
- Приглашений: 0
- Сообщений: 238
- Уважение: +3
- Позитив: +2
- Пол: Мужской
- Возраст: 30 [1994-11-13]
- Провел на форуме:
6 часов 7 минут - Последний визит:
2010-06-14 16:56:02
Для пользователей Safari
посмотреть это видео
http://vkontakte.ru/video-2428795_66104582
http://vkontakte.ru/video-2428795_67637981
Поделиться62009-02-22 02:22:12
- Администратор
- Откуда: Питер City
- Зарегистрирован: 2009-02-19
- Приглашений: 0
- Сообщений: 238
- Уважение: +3
- Позитив: +2
- Пол: Мужской
- Возраст: 30 [1994-11-13]
- Провел на форуме:
6 часов 7 минут - Последний визит:
2010-06-14 16:56:02
как ставить шапки вместе с темами я еще разбираюсь, у меня получилось то что надо только цвет кое-где белый вместо серого
Поделиться72009-02-22 19:48:17
- Администратор
- Откуда: Питер City
- Зарегистрирован: 2009-02-19
- Приглашений: 0
- Сообщений: 238
- Уважение: +3
- Позитив: +2
- Пол: Мужской
- Возраст: 30 [1994-11-13]
- Провел на форуме:
6 часов 7 минут - Последний визит:
2010-06-14 16:56:02
вот неплохое оформление, сам его использую
Свернутый текст
body {background: #111 url(http://s51.radikal.ru/i133/0807/73/c1c79b51d51a.jpg)!important ;}
#pageHeader {Background: url(http://s53.radikal.ru/i141/0811/c6/15ebc6a09b7f.jpg) no-repeat !important; }
#quickquery {background: #fff !important}
#photoactions a, #profileActions a, DIV, Select, td, TEXTAREA, SPAN.ncc, Input, #nav li a, B, #endQuote, #startQuote, .actionspro, LI.written, TH, UL.pageList, .actionspro, ul.topNav li, #userProfile, #profileActions, .nc *,.groupslist table,#td.info, .bNav li a{background: transparent none !important}
#rateLeft, .voting_result_fg, option, #boxWrap, ul.tabs li.activeLink a{background: #868585 !important}
#rateRight, .voting_result_bg{background: #cccccc !important}
a:hover, .header, #header, #content, .msgOld em {background-image: none !important}
a, h1, h2,h5, a:hover, #nav li a:hover, #header, span, b, small, p, h4, .description .topNav a {color: #fff !important}
#myLink, td, small, caption, span, p, b, LI, Div, #nav li a, input, select, option, dd, label, .note strong {color: #d1d1d1 !important;}
#quickquery, div.actions, #myLink, #content, TextArea,Div.playline, TD, Input, select, TH, H4, H2, #photoactions a, #photoactions .action_link, #photoactions .non_action, .bNav li a, ul.buttonRow a,
.header, .flexHeader, #wrapH
{border-color: #fff !important}
#wrapH {border-bottom: 1px solid #fff !important}
#nav li a, .nc *, LI, p, B, #profileActions a, .pageList a
{border-color:transparent !important;}
div {border-color: #c9c9c9 !important;}
.notes_titles li.app {background: transparent none !important}
#selector { background-color: #cccccc !important; }
#nameInner, .hm, #tagframe2{ background-color: #868585 !important; }
#tagframe2inside3, .flatTabOn , #boxControls, #boxTitle{ background-color: #000 !important; }
.taghandle { background-color: #fff !important; }
#boxWrap,.flatTab{background: #868585 !important;}
#content, a.wallFunc {background: #4c4c4c !important;}
.mailbox table tr.newRow,.rateRow, .rateBody{background: #868585 !important}
#quickSearch input { border-color: #ffffff !important;}
.pageList .current a {border-bottom:2px solid #000 !important;
color: #000 !important;}
#calendar table {background: transparent !important;}
#tagname a, .inputSearch, #userlist label, .FG a, .Group1, .Group2, .Group3, .Group4, .Group5, .Group6, .Group7, .Group8, #dld, #sideMenu li.active a, #msg {color: #000 !important;}
#reply_field, textarea, .editBody {color: #fff !important;}
#rateLeftGold {background: #921a00 !important;}
#rateRightGold, .vcheck{background: #111 !important;}
.postHeader, .wallpost .header, .flexHeader, ul.commentsPages li.current , #boxBody{
background:#747474 !important;}
blockquote , ul.tabs li.activeLink a:hover, ul.tabs a:hover, .dArrow a, .upArrow a, #wikiTab:hover, .pageList a:hover, #votingButton:hover{background: #666666 !important;}
blockquote{border-color: #303030!important;}
ul.buttonRow a, #videoactions a, ul#sections a, #votingButton, a.addAudioLink, .rightArrow a, .leftArrow a {
background-color:#6f6f6f!important;}
#banner1, #banner2 {display: none !important}/* календарь текущий день */
.dayCell[style='background-color: rgb(207, 224, 240);']{ background:#111 !important; }
/* календарь выходные день */
.dayCell[style='background-color: rgb(255, 247, 202);']{ background:#4c4c4c !important; }
/* календарь праздник */
.dayCell[style='background-color: rgb(244, 249, 253);']{ background:#4c4c4c !important; }
.dayCell, .dayCellLeft
{background: #747474 !important;}
#selector #name, .rateTabOff a, .rateTabOn a{color: #111 !important}/*группы по порядку*/
#groups .flexBox { visibility: hidden !important; }
#groups .flexBox a { visibility: visible !important; display: block !important; overflow: hidden !important; margin-bottom: -5px !important; margin-left: -7px !important; padding-left: 5px !important; border: 1px dashed #c3c3c3 !important; }
#groups .flexBox a:hover { border: 0px !important; border-left: 2px solid #000000 !important; padding: 1px 1px 1px 4px !important; text-decoration: none !important; } }@-moz-document url-prefix(http://vkontakte.ru/away.php) {
body {color: #747474 !important;}
Если что-то непонятно спрашивайте.
Поделиться82009-02-22 20:32:52
- Администратор
- Откуда: Питер City
- Зарегистрирован: 2009-02-19
- Приглашений: 0
- Сообщений: 238
- Уважение: +3
- Позитив: +2
- Пол: Мужской
- Возраст: 30 [1994-11-13]
- Провел на форуме:
6 часов 7 минут - Последний визит:
2010-06-14 16:56:02
вот код вместе с этой шапкой, у меня получилось их соеденить без помарок))
Код:
Свернутый текст
body {background: #111 url(http://s51.radikal.ru/i133/0807/73/c1c79b51d51a.jpg)!important ;}
#pageHeader {Background: url(http://s53.radikal.ru/i141/0811/c6/15ebc6a09b7f.jpg) no-repeat !important; }
#pageHeader {background: url(http://s58.radikal.ru/i160/0812/31/862191d94502.png) !important;width: 804px !important;height: 105px !important;position:absolute !important}
#pageHeader li {background: transparent !important}
#pageHeader a {margin-left: -32px !important;color: #ffd !important}
#pageHeader a:hover {text-decoration: none !important}
#quickSearch {display: none !important}#topNav a[href^="id"]{position:absolute;margin-left: 140px !important;height: 50px !important;width: 80px !important;opacity: 0 !important}
#topNav a[href^="search"]{position:absolute;margin-left: -255px !important;margin-top: 15px !important;width: 50px !important;height: 30px !important}
#topNav a[href^="search"]:hover {background: url(http://i020.radikal.ru/0812/14/7e8fce578807.png) !important;width: 50px !important;height: 30px !important}
#topNav a[href^="browse"]{position:absolute;margin-left: -215px !important;margin-top: 25px !important;width: 55px !important;height: 30px !important}
#topNav a[href^="browse"]:hover {width: 55px !important;height: 30px !important;background: url(http://s39.radikal.ru/i086/0812/eb/4ded170f5f64.png) !important}
#topNav a[href^="people"]{position:absolute;margin-left: -175px !important;margin-top: 35px !important;width: 55px !important;height: 30px !important}
#topNav a[href^="people"]:hover {background: url(http://i008.radikal.ru/0812/4c/51bc1f219d04.png) !important;width: 55px !important;height: 30px !important}#topNav a[href^="market"]{position:absolute;margin-left: 70px !important;margin-top: 35px !important;width: 85px !important;height: 30px !important}
#topNav a[href^="market"]:hover {width: 85px !important;height: 30px !important;background: url(http://s47.radikal.ru/i118/0812/13/487ba6c21817.png) !important}
#topNav a[href^="invite"]{position:absolute;margin-left: 95px !important;margin-top: 25px !important;width: 85px !important;height: 30px !important}
#topNav a[href^="invite"]:hover {width: 85px !important;height: 30px !important;background: url(http://s40.radikal.ru/i089/0812/f6/d555df87a6a6.png) !important}
#topNav a[href^="login"]{position:absolute;margin-left: 115px !important;margin-top: 15px !important;height: 30px !important;width: 50px !important}
#topNav a[href^="login"]:hover {height: 30px !important;width: 50px !important;background: url(http://s53.radikal.ru/i140/0812/e0/2976d1d8a90e.png) !important}div#pageBody {padding-right: 55px !important}
#header {height: 120px !Important;background: #444 !Important;border-color: transparent !important}
#header h1{text-align: center !important;margin-top: 104px !important}
#header span {color: grey !important}
#header b {text-decoration: blink !important;font-size: 6pt !important;color: #f5f5dc !important}
#header a {color: #f5f5dc !important}
/**/
#home {display: none !important}
#sideBar {margin-left: -50px !important;margin-top: 130px !important}#quickquery {background: #fff !important}
#photoactions a, #profileActions a, DIV, Select, td, TEXTAREA, SPAN.ncc, Input, #nav li a, B, #endQuote, #startQuote, .actionspro, LI.written, TH, UL.pageList, .actionspro, ul.topNav li, #userProfile, #profileActions, .nc *,.groupslist table,#td.info, .bNav li a{background: transparent none !important}
#rateLeft, .voting_result_fg, option, #boxWrap, ul.tabs li.activeLink a{background: #868585 !important}
#rateRight, .voting_result_bg{background: #cccccc !important}
a:hover, .header, #header, #content, .msgOld em {background-image: none !important}
a, h1, h2,h5, a:hover, #nav li a:hover, #header, span, b, small, p, h4, .description .topNav a {color: #fff !important}
#myLink, td, small, caption, span, p, b, LI, Div, #nav li a, input, select, option, dd, label, .note strong {color: #d1d1d1 !important;}
#quickquery, div.actions, #myLink, #content, TextArea,Div.playline, TD, Input, select, TH, H4, H2, #photoactions a, #photoactions .action_link, #photoactions .non_action, .bNav li a, ul.buttonRow a,
.header, .flexHeader, #wrapH
{border-color: #fff !important}
#wrapH {border-bottom: 1px solid #fff !important}
#nav li a, .nc *, LI, p, B, #profileActions a, .pageList a
{border-color:transparent !important;}
div {border-color: #c9c9c9 !important;}
.notes_titles li.app {background: transparent none !important}
#selector { background-color: #cccccc !important; }
#nameInner, .hm, #tagframe2{ background-color: #868585 !important; }
#tagframe2inside3, .flatTabOn , #boxControls, #boxTitle{ background-color: #000 !important; }
.taghandle { background-color: #fff !important; }
#boxWrap,.flatTab{background: #868585 !important;}
#content, a.wallFunc {background: #4c4c4c !important;}
.mailbox table tr.newRow,.rateRow, .rateBody{background: #868585 !important}
#quickSearch input { border-color: #ffffff !important;}
.pageList .current a {border-bottom:2px solid #000 !important;
color: #000 !important;}
#calendar table {background: transparent !important;}
#tagname a, .inputSearch, #userlist label, .FG a, .Group1, .Group2, .Group3, .Group4, .Group5, .Group6, .Group7, .Group8, #dld, #sideMenu li.active a, #msg {color: #000 !important;}
#reply_field, textarea, .editBody {color: #fff !important;}
#rateLeftGold {background: #921a00 !important;}
#rateRightGold, .vcheck{background: #111 !important;}
.postHeader, .wallpost .header, .flexHeader, ul.commentsPages li.current , #boxBody{
background:#747474 !important;}
blockquote , ul.tabs li.activeLink a:hover, ul.tabs a:hover, .dArrow a, .upArrow a, #wikiTab:hover, .pageList a:hover, #votingButton:hover{background: #666666 !important;}
blockquote{border-color: #303030!important;}
ul.buttonRow a, #videoactions a, ul#sections a, #votingButton, a.addAudioLink, .rightArrow a, .leftArrow a {
background-color:#6f6f6f!important;}
#banner1, #banner2 {display: none !important}/* календарь текущий день */
.dayCell[style='background-color: rgb(207, 224, 240);']{ background:#111 !important; }
/* календарь выходные день */
.dayCell[style='background-color: rgb(255, 247, 202);']{ background:#4c4c4c !important; }
/* календарь праздник */
.dayCell[style='background-color: rgb(244, 249, 253);']{ background:#4c4c4c !important; }
.dayCell, .dayCellLeft
{background: #747474 !important;}
#selector #name, .rateTabOff a, .rateTabOn a{color: #111 !important}/*группы по порядку*/
#groups .flexBox { visibility: hidden !important; }
#groups .flexBox a { visibility: visible !important; display: block !important; overflow: hidden !important; margin-bottom: -5px !important; margin-left: -7px !important; padding-left: 5px !important; border: 1px dashed #c3c3c3 !important; }
#groups .flexBox a:hover { border: 0px !important; border-left: 2px solid #000000 !important; padding: 1px 1px 1px 4px !important; text-decoration: none !important; } }@-moz-document url-prefix(http://vkontakte.ru/away.php) {
body {color: #747474 !important;}
Страница: 1