как сменить код элемента
Изменение исходного кода страницы
Сразу хочу пояснить зачем может понадобится изменить исходный код страницы. Естественно, лидирующее место занимает выпендреж. Многие любят “помериться пиписьками”. Или просто подделать переписку или что-то подобное, чтобы посмеяться. Многие видели шутки про агентов поддержки вконтакте, так вот, я научу Вас самостоятельно подделывать такие переписки. Наверное не очень понятно к чему я вообще веду, потому лучше покажу на примере и в скриншотах, чтобы более понятно было.
Примеры измененного и оригинального кода
1. Оригинал страницы:
2. Подделка, созданная через исходный код страницы:
Изменение исходного кода
Путем изменения исходного кода можно подделать все, а если имеются даже минимальные знания в CSS и HTML, то для Вас не будет никаких границ. Можно изменять информацию о переведенных средствах в Webmoney, если оплата происходила через сайт. В общем, если есть фантазия, то сами пораскинете мозгами и решите с чем повеселиться.
Я буду показывать создание шутки с агентом поддержки, а именно с агентом 3-х сотым, так как его шутки наиболее актуальны в сети. Многие из них являются фейками, созданные таким образом, как я сейчас опишу.
1. Заходим на страницу, которую будем изменять. У меня это страница технической поддержки вконтакте:
2. Нажимаем кнопку F12 или наводим мышкой на тот элемент, который будем изменять. В моем случае это аватарка тех. поддержки и его имя. Наводим, нажимаем правой кнопкой по элементу и выбираем “просмотр кода элемента”.Находим поле, которое будем менять, нажимаем правой кнопкой, находим пункт Edit as Html и меняем. Далее смотрите скриншоты:
Тут я изменяю аватарку
Можно увидеть, что аватарка изменилась, она стала синей, а была оранжевая (я менял не цвет, а номер аватарки)
С аватаркой мы закончили, теперь приступим к изменению имени.
Имя изменено, теперь можно изменить и сам текст. Сам процесс изменения не буду показывать, ибо все аналогично, покажу конечный результат.
Особо хитрые люди могут использовать это для своих мошеннических манипуляций. Рассказывать про это не буду, догадаетесь сами, если понадобится
Как изменить html код страницы в браузере
В данном посте покажем, как можно изменить код страницы в браузере Google Chrome. В других браузерах это делается аналогично. Я думаю трудностей не будет с этим.
Для изменения исходного кода страницы не обязательно хорошо знать HTML и CSS. Далее вы это сами увидите.
Редактирование html кода в браузере
Мы будем менять данные на сайте. Изменения в коде будут видны только нам. При обновлении страницы они исчезнут.
Откройте в браузере страницу сайта, в которой необходимо изменить код. Это можно
сделать следующим образом прямо на странице сайта.
Выделяем и нажимаем правой кнопкой мыши после чего появится в правой части окна кусок кода, который будем редактировать.
В контекстном меню нажимаем Edit as HTML и у нас появится выделенный код.
При такой редакции мы видим сразу результат.
Вверху картинки отмеченное красной рамкой HTML код, находящийся в шапке сайта, стиль которого будем менять.
Внизу красной стрелкой показано style.css:473 и находится в Консоли> Внешний вид>Редактор темы>файл style.css строка 473. Как можно это использовать?
Эти изменения можно использовать следующим образом. Копируем в блокнот Notepad++ с расширением html. Если это Ваш сайт, то вносим изменения в файлы на веб-сервере.
Или эти изменения можно внести в Консоли административной панели сайта, используя Редактор темы файлов.
С помощью подмены HTML кода, мы сможем изменить открытую веб-страницу как захотим.
Умение изменить исходный код страницы – дает отличный навык для продвинутого пользователя Интернета.
Внесенные изменения в код страницы будут оставаться такими. Пока мы не обновим страницу. При этом произойдет возврат в первоначальное состояние.
Редактирование CSS во встроенном редакторе
Знаете CSS – можно отредактировать и сделать предварительный просмотр изменений во встроенном редакторе CSS.
Для этого в заходим в Консоль админ панели и при наведении курсора на Внешний вид выпадает меню где нажимаем на Редактировать CSS
Открывается с левой стороны окно для редактирования.
Нажимаем на Дополнительные стили и открывается поле для загрузки кода CSS.
Код CSS в котором будем производить изменения копируем и вставляем в вышеуказанное поле.
После загрузки редактируем код и смотрим результат, если нас все устраивает и мы нажимаем на кнопку Опубликовать. Все изменения в дизайне сайта будут такими же как в предварительном просмотре.
При неготовности опубликовать произведенные изменения. Нажимаем на пиктограмму в виде шестеренки. Открывается дополнительное окно
где можем сделать пометку Сохранить. Изменения будут сохранены, и можно будет поделиться. С внесенными изменениями, без публикации. Останется как черновик.
Также можно Запланировать публикацию произведенных изменений, на будущую дату: День, Месяц, Год и Время выставляем по своему желанию.
Далее мы можем посмотреть полную историю произведенных нами изменений. Это очень удобно в истории отражены изменения данных до и после.
Или мы можем просто отменить изменения. Нажав на пиктограмму корзины.
Как найти и изменить код html
И вот недавно понадобилось изменить цвет ссылок. Перелопатив кучу литературы по этому вопросу, понял простую вещь: все приводят примеры из собственных шаблонов, но шаблоны-то у нас у всех разные и хорошо, если код из примера хоть чуть-чуть похож: не нытьем, так катаньем все равно найду — методом тыка.
С кодом ссылки номер не прошел. Все указывали совершенно разные пути. Задумался, нет ли простого и точного инструмента, как найти нужный код html на любом сайте. Многие блоггеры даже с опытом испытывают трудности в незначительной доработке шаблона. В этом нет ничего страшного, ведь у каждого свои интересы и цели создания сайта.
Если вы хотите внести небольшие изменения в шаблон, например изменить любой заголовок, название статей и рубрик, цвет и размер шрифтов и ссылок, обычно вполне достаточно научиться простому принципу, который рассмотрен в этой статье. Но бывают и сложные случаи, требуюущие либо более глубокого изучения html и css, либо помощи специалиста.
Однажды обратился знакомый с просьбой найти, где изменить цвет панели рубрик в его шаблоне. Закачал тему на тестовый поддомен. Настройки этого элемента хранились не в style.css, а в другом файле, поэтому человек не мог найти.
Как найти и изменить html и css код сайта
Если не любите длинные статьи, для вас в конце статьи видеоурок, в котором рассказывается, как можно увидеть код html сайта с помощью Notepad++ и внести изменения в дизайн любого шаблона на примере, как поменять цвет шрифта. В видео найдутся и другие тонкости обращения с блогом. А для тех, кому ближе и понятнее текст, внизу подробный разбор темы со скриншотами.
httpv://youtu.be/uIlVvwCt2ho
Термины и понятия
Было бы точнее называть статью «Как найти код css«, но я решил остановиться на «неправильном» названии, потому что в основном ответ на этот вопрос ищут в html. CSS и HTML — очень разные вещи, хоть и являются двумя частями одной системы. В интернете много технических статей, нам здесь достаточно будет понять, что:
И если вы задались вопросом, как изменить, например, цвет заголовка сайта, размер шрифта в текстах или цвет заголовков в сайдбаре, то искать все это нужно в таблице стилей CSS. Вот это единственное, что стоит понять для начала, чтобы вносить изменения в код самостоятельно.
Мне нравится превращать сложное в простое. Помню, давно, когда у меня была первая машина, очень старая, проводка гнилая, часто перегорали предохранители, и я тянул ее каждый раз на СТО на буксире. Представьте, сколько денег было выкинуто, при том что самостоятельная замена, как оказалось, стоит копейки.
Однажды я посмотрел, что именно делает мастер. До сих пор не знаю, как устроен предохранитель. Но знаю, где его менять). Мотор я чинить сам бы не стал, а уж предохранитель заменить не сложно. Так же и с сайтами.
Если вы не хотите стать программистом, то нет необходимости глубоко разбираться в программинге. Достаточно ясно понимать, что для чего предназначено, где это искать и как изменить. То, что можно, лучше изменить самим, а все остальное оставить специалистам. В статье о дизайне блога есть полезная ссылка на эту тему.
Нужно ли быть специалистом во всем
В seo-блогах часто ведутся дискуссии, нужно ли новичку глубоко разбираться в html, а еще лучше — научиться самим писать сайты, чтобы было все уникальное.. Ну, не знаю — каждому свое и тут уж кому что ближе. Мне интересно чуть больше, поэтому я сейчас дополнительно учусь у Владимира. В ноябре этого года Владимир открыл свой авторский блог. Его блог сделан на самом простом, бесплатном шаблоне, он его лишь чуть изменил под себя.
Через 10 дней существования блог занял 104-е место в рейтинге всех сайтов Рунета с посещаемостью около 1,5 тысяч человек в сутки. За 10 дней. Так в чем же дело? Владимир прекрасно разбирается в html, может заказать и купить себе уникальный шаблон. Вот и вы должны понять, что секрет кроется не в шаблонах, а в полезности информации.
Где прячется код html
Простите за отступление, вернемся к нашим кодам). Допустим, вы хотите изменить цвет шрифта заголовка блога. Будем рассматривать на примере моего тестового сайта.
ВАЖНО: не перепутайте с ПРОСМОТРОМ КОДА СТРАНИЦЫ! Вся страница нам сейчас не нужна, только отдельный элемент.
Щелкаем по нему — в нижней части браузера появляется окно просмотра кода:
Красным выделена строка кода, которую мы меняем.
А вот в области, выделенной синим, содержится то, что мы ищем. Именно здесь вы можете найти точную (а не приблизительную) строчку кода, отвечающую за шрифты, цвет, размер, выделение и прочее. Таким образом вы можете узнать ЛЮБОЙ код любого элемента любого шаблона.
Находим нужную строчку в блоке, выделенным синим. Справа там есть ползунок, можно пролистать и найти нужную строчку.
Общий принцип, где что ищется:
Название шрифта — в строке FONT FAMILY
Размер шрифта — в строке FONT SIZE
Цвет шрифта — в строке COLOR
Вот три основные строчки, в которых меняется название, размер и цвет шрифта любого элемента. Справа в строке style css дается позиция строчки в документе. Если вам нужно изменить какой-то другой элемент (например, нужно узнать, где находится строчка. в которой можно изменить цвет панели меню или цвет ссылок), все делается абсолютно так же.
красным на рисунке выделена строчка, которую мы будем копировать,
чтобы потом найти ее в таблице стилей.
Находим нужную строчку в файле «таблица стилей (style.css)». Это делается уже в админке. Настоятельно прошу, пока нет уверенности и полного понимания, все эксперименты проводить на тестовом поддомене, чтобы исключить поломку сайта.
Итак, заходим в админпанель: КОНСОЛЬ — ВНЕШНИЙ ВИД — РЕДАКТОР. В правом сайдбаре находим файл ТАБЛИЦА СТИЛЕЙ (STYLE.CSS), открываем его.
Теперь открываем строку поиска клавишами CTRL + F: в верхнем окне появится пустая строчка-окошко. Вставляем в него ту строку, что скопировали в пункте 4.
И вы увидите, как в таблице стилей эта строчка выделится (на рисунке — оранжевым цветом):
Вносим изменение в элемент. В нашем случае мы меняем цвет шрифта, поэтому в строке COLOR подставляем другое значение — того цвета, который хотим. В примере черный цвет, его значение:
Выбрать цвет можно в любом сервисе палитр веб-цветов: наберите в поисковике «Палитра веб-цветов» и подберите тот, что хотите. Выбираем цвет, копируем его цифровое значение и аккуратно подставляем взамен старого. после чего нажимаем ОБНОВИТЬ ФАЙЛ и переходим смотреть, что получилось.
Если изменения не отобразились, очистите кэш за прошедший час и снова зайдите на страницу — на этот раз все должно отобразиться.
Описывается это долго, но на практике все делается быстро, особенно когда появляется начальный навык.
Более подробно, как изменить те или иные элементы:
На сегодня все, больше не буду мучить вас кодами. Надеюсь, что теперь вы сами сможете легко находить и менять любой элемент кода html, или, вернее, код css — да простят меня специалисты за упрощение. А если не разберетесь, посетите все же страницу Полезные сайты. Не тратьте время на ерунду.
Предлагаю посмотреть видео Артема Абрамовича, как искать и находить в любой теме/шаблоне, для любого движка (wordpress, joomla и т.п.) любое слово или элемент и заменить на то, что вам надо:
Как сохранить html страницу после редактирования Developer tool chrome?
Когда я пытаюсь сохранить страницу из браузера при помощи ctrl+s получается следущее:
ctrl+s и есть два выбора, при сохранении «только HTML» ничего не сохраняется
А при сохранении полной страницы, добавляется в код к ссылкам непонятная фигня
Как правильно сохранить измененный код
Это было бы идеально. Пробывал, не работает!
То что ты редактируешь на вкладке element не сохранится.
Если вы говорите, про обычный редактор кода во вкладке Sources то все верно! Но к вопросу не имеет ни какого отношения. Как и livestyle.io который сохраняет только CSS.
Я написал все очень доходчиво и со скринами. Там на фото все показано. Только измененный код в Element.
Пока что единственный выход это копировать прямо оттуда через Edit as HTML на тег html (или ctrl+c можно еще) код и вставлять его в IDE. Но это долго.
Алекс Глебов, Да ненужен мне CSS. Чистый HTML надо с атрибутами и текстом. Есть много решений для css а для сохранений html не вижу не одного.
Вопрос называется Как сохранить html страницу после редактирования, а не как сохранить CSS
Как менять сообщения в вк. Как редактировать сообщения вконтакте
На компьютере
На самом деле, вопрос о том, как редактировать сообщения в ВК с компьютера, решается очень просто:
Кстати, если совершенно случайно Ваша рука дрогнула, и Вы вместо изменения текста удалили весь диалог с собеседником, не беда. Восстановить переписку не составит большого труда, если знать, что и где нажать.
Инструкция, как изменить сообщение в ВК через код элемента
Ни для кого не секрет, что в социальной сети «ВКонтакте» основным и наиболее часто используемым инструментом являются сообщения.
Ими пользуется абсолютно каждый пользователь, и сегодня я решил вам рассказать о некоторых фишках и трюках, которые можно с ними проделать.
А именно: как изменить сообщение в ВК через код элемента, какие еще есть способы изменения текста ЛС, в каких ситуациях возникает такая необходимость, как поменять фон диалогов и многое другое.
Зачем нужно менять сообщения в ВК?
Причины бывают разные. Начнем, пожалуй, с самой простой – опечатки и ошибки. С этой проблемой сталкивается каждый пользователь ВК. Причем как те, кто пользуется десктопной версией сайта, так и те, кто использует мобильное приложение.
Ошибка в слове или фразе легко исправляется с помощью встроенного инструмента редактирования, о котором я расскажу немного позже.
Иногда причиной изменения сообщений в ВК может стать желание исправить или удалить уже отправленное ЛС.
Например, вы на эмоциях написали человеку лишнего, а затем передумали и решили исправить текст, пока собеседник не успел его прочитать. В данной ситуации вам также поможет редактирование сообщений ВК.
А в некоторых ситуациях сообщения изменяются для того, чтобы на скриншоте страницы с диалогами отображалась нужная информация. Причем не только свои, но и чужие. И здесь мы уже будем прибегать к коду страницы.
Как изменить текс ЛС через кода элемента?
Прежде чем давать пошаговую инструкцию, важно упомянуть об одной особенности такого изменения. Оно не будет постоянным. То есть, после обновления страницы все изменения пропадут, так как мы не отправляем информацию на сервера ВК, а изменяем ее на уровне кэша браузера.
Как изменить сообщение в ВК через код элемента:
После проделанных действий ЛС изменится, и вы можете смело делать скриншот экрана. Но если обновить страницу, то изменения пропадут. Данную процедуру можно проделать только на ПК или ноутбуке.
Как отредактировать текст ЛС во ВКонтакте?
Еще один способ изменения текста сообщений во ВКонтакте – это использование встроенного инструмента редактирования.
Инструкция для десктопной версии сайта ВК:
Готово! Рядом с отредактированным сообщением появится метка «(ред.)». По ней можно понять, какие ЛС редактировались, а какие нет.
К сожалению, данная функция не предназначена для пользователей мобильного приложения и мобильной версии сайта. И даже если зайти на полную версию сайта с телефона, кнопки редактирования не будет.
Как поменять фон диалогов?
Еще один довольно актуальный вопрос, который постоянно возникает в головах пользователей ВК. Лично я впервые узнал о том, что фон в диалогах ВКонтакте можно изменить от друга, который прислал мне скрин своих сообщений, но его интерфейс вовсе не был похож на тот, который использовал я. И тут у меня возник вопрос, как поменять фон?
Сегодня есть несколько способов изменения фона диалогов в ВК, причем как на ПК, так и на смартфонах.
Первый способ – это браузер Orbitum. В правом верхнем углу браузера есть специальная кнопка «Сменить тему». Нажав на нее, вы сможете изменить фон всех страниц ВК, своего рабочего стола и/или оформление самого браузера.
Orbitum можно скачать и на ПК, и на мобильное устройство. А его главной особенностью является то, что вашу тему будут видеть и другие пользователи, которые используют данный браузер.
Второй способ – расширения для браузеров. Их есть много, и все они позволяют изменять фон диалогов в ВК.
Наиболее популярными для Google Chrome и Яндекс.Браузера являются:
Достаточно перейти в настройки браузера, а именно в раздел «Дополнения» (или «Расширения»). Затем в поиске найти нужное расширение и установить его. Например, ВКобои позволяют устанавливать фон для ВКонтакте всего в пару кликов. Найдите понравившееся вам изображение в сети и нажмите по нему второй кнопкой мыши, а затем выберите пункт «Установить, как обои ВКонтакте».
Третий способ – плагины и программы. Использовать их нужно осторожно, так как в интернете можно с легкостью натолкнуться на зараженные файлы. Поэтому, никогда не отключайте антивирус при скачивании подобных программ.
Наиболее популярными считаются:
Даже эти, проверенные тысячами людей, сервисы стоит скачивать только с проверенных источников.
Ну и напоследок стоит упомянуть встроенную возможность изменения фона в приложении Kate Mobile для смартфонов. Это одна из самых популярных замен официальному приложению «ВКонтакте».
Чтобы сменить фон в Kate Mobile, необходимо:
Пункт «Ночная тема» позволяет делать фон темным в определенные часы (например, с 21 ч. до 07 ч.).
Как поменять цвет сообщений?
Этот вопрос интересует многих, кто меняет тему оформления социальной сети «ВКонтакте». Не буду томить, скажу сразу. На данный момент никак нельзя поменять цвет сообщений в ВК. По крайне мере, я не нашел ни одного рабочего метода.
На телефоне
Редактировать сообщения в ВК через телефон так же просто, как и через компьютер, однако записи, которые содержат только ссылки, удобнее изменять все-таки через ПК. Причина этого проста — при нажатии на смс-ссылку вместо меню открывается сама ссылка.
Но прежде чем следовать этой инструкции, сначала убедитесь в том, что у вас установлена свежая версия приложения.
Важно! Если Вы решили отправить другу пустое сообщение, а потом передумали, это руководство к действию будет Вам также очень кстати!
В приложении
Для редактирования в мобильном приложении потребуется:
В мобильной версии
В мобильной версии алгоритм немного отличается, потребуется сделать следующее:
Если не удаётся выделить сообщение, то надо проверить дату отправки: скорее всего, записи уже больше суток. Также вам следует учитывать, что в мобильной версии смайлы в тексте можно только удалять, но не редактировать.
Ответы на прочие вопросы по редактированию сообщений в ВК
В течение какого времени можно изменять отправленное сообщение?
В течение суток (24 часов) с момента отправки, но не с момента последнего редактирования. После истечения срока сообщение уже никак не изменить.
Сколько раз можно редактировать сообщение?
Можно ли отредактировать прочитанное сообщение?
Да, можно. Точно так же, как и непрочитанное. В любом случае рядом с ним появится пометка (ред.)
— то есть «редактировано». Прочитанное сообщение изменится, но останется «прочитанным».
Станет ли прочитанное сообщение непрочитанным, если я его отредактирую?
Нет, останется выглядеть прочитанным.
Можно ли отредактировать и полностью стереть (удалить) сообщение?
Можно ли изменить чужие сообщения?
Как отредактировать сообщение, если тебя занесли в ЧС?
Почему не могу изменить сообщение?
Зачем вообще нужно редактирование сообщений?
Чтобы можно было исправить какую-нибудь глупую опечатку или что-то перефразировать, если написал и подумал, что собеседник тебя не вполне поймет.
Как посмотреть, какое было сообщение до редактирования?
Никак, но если у тебя включены уведомления о новых сообщениях на почту, то туда придет первый вариант сообщения.
Как узнать, во сколько было отредактировано сообщение?
Наведи курсор на пометку (ред.)
— появится всплывающая подсказка, в которой будет указано время редактирования сообщения.
Как сохранить исходный вариант сообщения на случай, если человек его отредактирует?
Если ты волнуешься, что собеседник изменит свое сообщение в личных интересах, выдели его и перешли самому себе (нажав кнопку «Переслать»,
найди себя в диалогах по имени). Теперь, даже если человек его отредактирует, у тебя будет копия оригинала с датой и временем.
Пользователи наконец-то дождались изменений в механизме отправки личных сообщений Вконтакте. Теперь уже отправленный текст можно изменить. На редактирование сообщения дается 24 часа. Давайте разбираться, как это сделать.
Что увидит собеседник?
Как и обещали, рассказываем, что увидит ваш собеседник, если вы отредактируете отправленное ему сообщение:
Вы в любой момент можете посмотреть отредактированное сообщение в ВК, и, если результат вас не устроит результат, то снова внести изменения.
Важные моменты
Пользователям соц. сети стоит знать о том, что:
Пользователь может отредактировать сообщение в ВКонтакте в мобильной версии сайта, через сайт на ПК, а также в мобильном приложении. Однако, некоторые старые версии приложения не поддерживают эту возможность.
Кстати, Вы всегда можете «отрепетировать» текст своего сообщения, написав самому себе. Тогда Вам не придется менять его после отправки