Как сделать скрытый контент

Обновлено: 04.07.2024

Желание скрыть часть контента может возникать по разным причинам. Выяснять, для чего скрывают текст, картинки и другие элементы страницы, не станем, лучше узнаем, как написать невидимый текст, спрятать фотографию, баннер, ссылку различными способами. Для реализации большинства методов потребуются минимальные знания в области программирования и HTML-разметки.

Как скрыть текст на сайте

Используем HTML-код

Чтобы при помощи HTML создать скрытый текст, нужно открыть исходный код страницы, найти скрываемое слово или предложение и установить цвет шрифта таким же, как цвет фона страницы. После загрузки страницы в браузере текст сольется с фоном и станет невидимым. Также предложения можно сделать практически невидимыми путем изменения размера шрифта до очень маленького. Еще один вариант: скрыть текст под изображением, которое дополнительно может сливаться с фоном и быть из-за этого невидимым.

Используем DHTML

Динамический HTML-код состоит из обычного HTML, каскадных таблиц стилей и элементов языка сценариев. Он позволяет вносить изменения в содержимое страниц без их перезагрузки. Для реализации задуманного пользователю потребуется создать небольшой код CSS и установить его в теле страницы между тегами body. Каскадные таблицы стилей дают практически безграничные возможности в плане изменения внешнего вида контента. В примере текст скрыт, но при нажатии на кнопку он появляется. Если пользователю требуется только скрыть контент, то часть кода можно удалить.

Как скрыть текст на странице в DHTML

При помощи стилей можно прятать ссылки, предложения, текстовые блоки, таблицы, изображения, используя свойства скрываемого объекта. Например, свойства opacity, visibility, display, position, clip-path позволяют скрывать объекты разными способами.

Способы скрытия объектов

Используем JavaScript

Код скрипта можно вписывать как в заголовок, так и в тело страницы между тегами head или body соответственно. Главное, не забыть обозначить начало и конец кода. Для этого пользуются тегами script.

Сначала надо написать функцию, которая будет скрывать контент.

Функция для скрытия контента в JavaScript

Далее в нужном месте кода страницы следует запросить вывод результата работы скрипта.

Вывод результата работы скрипта

Ссылка 'Подробнее' в JavaScript

Некоторым авторам блогов полезно будет узнать, как скрыть публикации в Инстаграм от одного пользователя. Если вы размещаете какой-то контент и не хотите, чтобы конкретный человек его видел, то сможете ограничить его доступ. Существует несколько способов это сделать.

Но в их числе нет такого, который позволял бы скрыть какую-то конкретную публикацию всего от 1 человека. Но пути обхода для этого есть. Можно либо полностью заблокировать человека, либо закрыть пост от всех своих фолловеров. В некоторых случаях посты лучше вовсе не публиковать, а в личной переписке поделиться снимками с 1 или несколькими адресатами.

Что значит скрыть контент в Instagram

В Instagram можно скрывать как свои фото от чужих глаз, так и контент других пользователей. Если владелец страницы не хочет отписываться от человека, но тот буквально засоряет ленту своими однотипными фотографиями или неуместными постами, можно это остановить. Скрыть контент в Инстаграм, что это означает и как это можно сделать:

Больше в ленте снимки этого человека появляться не будут. Если блогер в какой-то момент передумает, в чужом профиле он сможет нажать кнопку разблокировать, и всё вернётся на круги своя. Этот человек даже не узнает о проделанных манипуляциях.

Как скрывать посты от 1 человека методом блокировки

Основные этапы, как скрыть публикацию в Инстаграм от одного человека:

Человек, которого автор заблокирует, не получит никакого уведомления о выполненном действии. Но также он исчезнет из числа ваших подписчиков. Когда вы решите его разблокировать, вам придется заново подписываться на этого человека, а ему на вас. Чтобы убрать человека из чёрного списка нужно выполнить такую последовательность действий: открыть настройки – конфиденциальность – заблокированные аккаунты. Там найти блогера, которого заблокировали, и теми же действиями разблокировать.

Как убрать пост способом архивирования

Если вы не знаете, как скрыть фото в Инстаграме от всех, но не хотите удалять пост, метод архивирования пригодится в этом случае. Благодаря этой функции можно переместить публикацию из ленты в архив. Другие люди, подписчики и все пользователи Instagram её больше не увидят. Но на записи останутся лайки и комментарии.

Каким образом можно заархивировать пост в Instagram:

Архивация – это не удаление снимков. Если вы знаете, как скрыть фотографии в Инстаграме, переместив их в архив, значит, сможете и в любой момент их вернуть в ленту. Для этого нужно будет:

Закрытый аккаунт

Если вы не знаете, как скрыть фото в Инстаграме от 1 человека, который не является вашим подписчиком, просто закройте свой аккаунт. Человек не сможет видеть все фото, видео и другой контент автора, но останется возможность писать тому в Директ.

Всю ленту владельца закрытого аккаунта могут видеть только его подписчики. Люди, желая стать подписчиком, подают заявку, а владелец аккаунта уже её рассматривает и принимает решение. Если он не хочет принимать человека в свои фолловеры, просто стоит проигнорировать этот запрос. Таким образом круг лиц, которые могут видеть фото блогера можно существенно ограничить. Если вы не знаете, как в Инстаграмме скрыть фото от некоторых людей, этот способ тоже пригодится. Просто эти люди не должны быть в списке ваших подписчиков. Как же можно закрыть аккаунт:

Как закрыть сторис в Instagram от одного пользователя

Если вы не знаете, как скрыть публикации в Инстаграм из сторис от конкретного человека, пригодится такая удобная инструкция:

Как скрывать отметки на фото

Часто людей интересует совсем не вопрос, как скрыть публикации в Инстаграм от одного пользователя. Они хотят узнать, как избавиться от отметок, которые делают другие люди у себя в блогах. Каждый блогер старается выкладывать свои лучшие снимки с хорошим ракурсом, светом, фильтрами. А другие пользователи могут выкладывать снимки, на которых остальные люди получаются не совсем удачно. Да еще и делает отметки профилей присутствующих. Если вы хотите убрать отметку, не желаете, чтобы другие люди узнали вас на ней, можете следовать такой инструкции:

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

Фото для узкого круга лиц

Если владельцу странички хочется поделиться фотографиями с каким-то ограниченным кругом лиц в Instagram, сервис предоставляет такую возможность пользователям. Публиковать эти снимки в ленту не получится, а вот делиться имя в stories вполне реально. Для этого нужно:

Видеообзор:

Очевидно, что весь контент (весь пост полностью) закрыть легко, всего лишь добавив условие в файл темы, а я вам покажу, как скрывать конкретные участки поста, будь то предложение, ссылка или картинка.

Рассмотренные в этой статье примеры закрывают контент не только от неавторизованных посетителей сайта, но и от поисковиков.

Сначала создаем шорткод, вставив этот код в functions.php текущей темы:

Теперь второй шаг, при написании поста, когда вы захотите скрыть какую-то часть текста, просто поместите его между [member] и [/member] , например:

Сюда можно засунуть не только текст, но также ссылки (например ограничить доступ к скачиванию файлов), картинки и прочий HTML.

Отображение контента в зависимости от роли пользователя

Тут действует тот же самый принцип, но только с некоторыми усовершенствованиями. Опять начинаем с создания шорткода через functions.php:

Сам шорткод на странице редактирования поста будет выглядеть следующим образом:

А в этом случае будут применяться значения по умолчанию из массива $defaults:

Впервые познакомился с WordPress в 2009 году. Организатор и спикер на конференциях WordCamp. Преподаватель в школе Нетология.

Пишите, если нужна помощь с сайтом или разработка с нуля.

Комментарии — 74

спасибо! то , что надо! перекопала кучу плагинов, а тут такой простой и изящный метод!

рад, что смог помочь)

Почему то после вставки кода а functions.php и вывода шорткода в посте-ничего не происходит.только код не активный какой то-весь черный без подсветки.И этот код всплывает сверху в админке.Помогите разобраться в чем проблема.

это значит, что перед кодом надо добавить

сорри за долгий ответ.

Миша спасибо я уже разобрался) Действительно в этом проблема была.

ну я так и думал, ведь я почти через 5 дней ответил, реально не было возможности зайти на сайт и проверить комменты,
в след. раз постараюсь отвечать более быстро))

Миша подскажи пожалуйста.
А вот то же самое можно реализовать на Joomla .
Очень хотелось бы.

я джумлой не занимаюсь, но по идее должна быть такая возможность (или плагин какой-нибудь)

Добрый день! У меня противоположная проблема, после работы со страничкой вдруг стала активна эта функция входа на страничку через пароль. ПОдскажите как убрать это и сделать как прежде свободный вход

НЕ РАБОТАЕТ! Не в коем случае не пробуйте так сделать!

перед кодом и после вставь

Алексей 7 Окт 2013

Все работает,чего ты гонишь. Я на трех блогах проверял и никаких проблем.

Подскажите, как сделать так, чтобы скрыть один пункт в меню в шапке? На сайте есть меню: Главная Документы Контакты. Нужно сделать так, чтобы пункт "документы" становился видным после авторизации, а для гостей был скрыт.

Добрый день.
всё зависит от того, каким образом выводится это меню

Это отличное решение, но у него есть один существенный недостаток, поиск отлично видит скрытый контент и выводит страницу где он расположен, хоть сам блок и не виден.

Скажите, как сделать этот скрытый блок недоступным поиску?

чтобы сказать точно, нужно смотреть и тестировать, а так мне кажется вам следует в шаблоне поиска заменить get_the_content() на the_content() . Теоретически.

Михаил, добрый день.

У меня почему то не работает Ваш вариант.

Вставил код в Functions.php в конец файла.

До и после поставил Сергей 26 Авг 2014

после кода надо наверное ?> ставить

Михаил, добрый день.
А для полного сайта(контента) можете показать пример? Типа гости только видели одну статическую страницу. Спасибо!

Добрый день!
Вот универсальное условие для администраторов / редакторов:

А вот для авторизованных пользователей:

Спасибо большое,все просто и все работает :)

Все перепробовал. Инструмент отнюдь не универсальный.

А что тебе нужно универсального? Миша дал рабочий вариант с помощью него я не 1 тысячу рубликов зарабатывал. нужен универсальный - купи Wish List Member и танцуй с бубном.

А что тебе нужно от меня? Считаешь нужной мне ту информацию, которую выдал под комментарием?:)

Михаил, может, подскажете, почему у меня все-таки не получается:

Установил шорткод, и он отлично работает на страницах. Вот код из файла functions.php:

Однако на странице редактирования шаблона (page.php) обычный шорткод не работает. Использую следующий вариант: Текст, который нужно скрыть, и получается вот такое: Требуется регистрацияТекст, который нужно скрыть. Естественно, фраза "Текст, который нужно скрыть" и должна скрываться фразой "Требуется регистрация".

Обычный вариант [member]Текст[/member] не работает, естественно. Как же "зажать" текст в эти теги на php-странице?

он отлично работает на страницах

Однако на странице редактирования шаблона (page.php) обычный шорткод не работает

Так где он в итоге у вас работает, а где нет?

Работал в записях, не работал на страницах. Разобрался. Спасибо за пост.
Чтобы добавить "универсальности", советую отредактировать статью. Добавьте прямой пример рабочего кода для страниц .php:

Рад, что вы разобрались. Рекомендую ознакомиться с теорией, как работают шорткоды.

Ну спасибо, пошла Вордпресс переустанавливать. Все слетело - пустая страница.

Уверяю вас, переустанавливать WP совсем ни к чему. Во-первых, можете вставить код именно после (почему-то мне кажется, что проблема в этом), во-вторых, вы можете просто удалить мой код, в третьих, вы можете зайти в wp-config.php , включить WP_DEBUG и посмотреть, где именно возникла ошибка :P

Миша в точку сказал. зачем WP то переустанавливать?

Да просто я только установила вордпресс, хостинг мне не знакомый, пока не могу понять как попасть в файловый менеджер, чтобы менять файлы, спасибо за совет, но быстрее будет переустановить заново.

все работает на 100% , скрывает кнопки например, подскажите, как сделать ссылку на страницу регистрации прямо с надписи которая закрывает контент "зарегистрируйтесь бла бла. "

Так не пробовали?

не пробовал, учусь только пробовать,затягивает)

Проблема в отображении текста ошибки, обвожу тегами, текст пропадает, но уведомления нет на месте скрытого текста

Можно взглянуть на вашу функцию?

Но он прячет не содержимое контейнера .private, а вообще всё содержимое записи.

Ну, чтобы не отвлекать маэстро глупостями, пишу ответ:

Кто-нибудь знает, как выбросит содержимое этого контейнера и из поиска тоже?

Здравствуйте!
А в поиске тоже функцией the_content() выводится?

Здравствуйте, Михаил. Код работает хорошо, но возникла ситуация.
Я обернул в данные теги контент, где содержатся другие теги с прямыми скобками, в частности, я спрятал таблицу, в ячейках которой вставлены аудиозаписи в теге [audio]Музон[/audio]
В итоге незарегенные все правильно - не видят ничего, а вот зареганные видят исходный код контента, ни плееров, ни ссылок. Что можно придумать?

Здравствуйте!
Вот в этой статье, в самом низу, о том, как наложить фильтры.

Спасибо, Михаил, благодаря этой статье начал раскуривать коды. Добра Вам

Подскажите пожалуйста, возможно ли сделать этот метод для мультиязычного сайта? Установлен WP Multisite, русский и английский, файл functions.php один для всех. Т. е. или на английском сайте будет отображаться русское оповещение о регистрации, или на русском английское. Ну и ссылку соответственно не вставить о регистрации. Была идея написать уведомление через слеш, мол: "Регистрируйся/Register", но всё же.

Возможно, просто почитайте про функции работы с мультисайтом. У меня на блоге к сожалению об этом совсем немного.

Благодарю за быстрый ответ. Вышел из положения дублированием функции, добавил: "true_logged_in_user_content_en".

Style.css? Открываем и. Как сослаться на функцию может подскажете? Методом тыка пытался менять стили, но меняется весь текст(

А потом в стилях:

Огромная благодарность! Всё работает как часы швейцарские! Всего Вам наилучшего!

Миш, объясни, что ты делаешь этой строчкой:

Я давно читал об этой функции, но что то не могу понять, что она здесь делает

функция shortcode_atts() заменяет элементы массива $defaults на элементы из $atts , но только в том случае и только на те, которые указаны.

Функция extract() "распечатывает" массив в переменные, то есть $attr['hello'] превратится в $hello и т.д.

Здравствуйте! А как вывести кастомное поле внутри шорткода?
Это поле можно вывести шорткодом [acf field="name"]

То есть как вместо контента поставить этот шорткод?)

Ну шорткод внутри шорткода, ez

При регистрации пользователя, ему должна присваиваться группа, опять таки "А" "Б" "В". При этом пользователь из группы "А" должен иметь доступ к контенту категории "А", но не к "Б" "В". Пользователь из группы "Б" - к контенту из категории "Б" и т.д.
Администратор, естественно, должен иметь доступ ко всему контенту.

Суть вопроса - что использовать для реализации данной задумки? Механизм ролей? Или существуют более подходящие решения? :)

А контент как будете скрывать? Через if / else ?

Я правильно понимаю? – вы используете шорткоды member и access и при использовании этих 2 шорткодов, один перестает работать?

А трудность у вас в чём конкретно?

Нужно все условия поместить в одну функцию.

А можно как-то скрыть ссылку в посте, но с условием к примеру "открыть после 5 комметов".

Да, можно получить количество комментариев пользователя например при помощи get_comments() :

На некоторых сайтах имеет смысл скрыть часть контента от поисковых систем.

Как скрыть часть контента на страницах сайта от роботов поисковых систем?

Для каких целей следует скрывать содержание?

Разберемся с вопросами далее.

Зачем скрывать контент сайта от индексации?

Контент на сайте скрывается от поисковых систем для достижения различных целей.

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

Если от поисковых систем часть сайта скрывается, то для пользователей весь контент остается полностью видимым.

Итак, какой контент имеет смысл скрывать и зачем? Например:

Ссылки для улучшения внутренней перелинковки на сайте. Улучшение достигается за счет оптимизации распределения статического ссылочного веса на сайте;
Часть текста для повышения релевантности страницы;
Часть страницы для улучшения ранжирования. Например, скрытие рекламных блоков со страницы, которые находятся в верхней части страницы. Если такие рекламные блоки не скрывать, то поисковая система после рендеринга на так называемом первом экране распознает нерелевантный контент, что не позволит сайту ранжироваться лучше;
Часть страницы для защиты от санкций поисковых систем. Например, часто требуется скрывать исходящие ссылки на различные сайты.

Например, поисковые системы пессимизируют сайты с реферальными ссылками. Такие сайты зарабатывают на партнерских отчислениях. С точки поисковых систем таких как Google подобные сайты не несут никакой дополнительной ценности для пользователя, а значит и не должны находиться среди лидеров поиска.

Если реферальные ссылки скрыть, проблем не будет.

Как скрыть от поисковых систем часть страницы?

На практике скрыть контент сайта от индексации можно используя разные способы.

Наиболее распространенным способом по скрытию ссылки от поисковых систем является использование контейнера div при создании ссылки.

Но что делать, если речь идет о создании системы для скрытия контента?

Какую технологию использовать? Основные требования следующие:

У пользователя на экране должен отображаться весь контент страницы сайта;
Для поисковой системы должен отдаваться не весь контент страницы сайта;
Способ должен быть условно белым, чтобы сложнее было найти повод для санкций.

Не поддерживается движком поисковой системы;
Поддерживается популярными браузерами.

Рекомендованный материал в блоге MegaIndex по теме обновления краулера по ссылке далее — Google обновил поисковый краулер. Что изменилось? Как это повлияет на ранжирование?

Все приведенные способы основаны на принципах работы поискового краулера.

Но лазейка все еще есть. В результате обновления стала известна информация о принципах работы поискового краулера, используя которую можно сделать выводы о том, какие именно технологии поисковый робот не поддерживает, а значит не передает в систему ранжирования.

До начала этапа ранжирования происходит ряд процессов.

Весь процесс обработки информации до этапа ранжирования выглядит так:

После рендеринга происходит передача данных в систему ранжирования.

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

Теперь требуется разобраться с тем, какую технологию пока еще не поддерживает движок рендеринга. Применяя такую технологию на практике можно скрывать часть содержания страниц сайта от поисковой системы.

Итак, скрыть любую часть страницы от поисковой системы можно используя так называемые service workers.

Что такое сервис-воркеры? Сервис-воркеры — это событийный управляемый веб-воркер, регистрируемый на уровне источника и пути. Сервис-воркер может контролировать сайт, с которым ассоциируется, перехватывать и модифицировать запросы навигации и ресурсов.

Да, я вижу ваши лица. Подождите пугаться.

Если упростить, то сервис-воркером является программируемый сетевой проксификатор.

Иными словами, применяя сервис-воркер можно контролировать контент, который передаются пользователю.

В результате применения сервис-воркеров контент может изменяться. Поисковая система же обрабатывает такие корректировки, так как не поддерживает выполнения таких скриптов.

Почему метод эффективен в применении на практике? Сервис-воркеры поддерживаются всеми популярными браузерами и не поддерживаются движком рендеринга поисковой системы Google, через который данные передаются в систему ранжирования.

Следующие браузеры поддерживают сервис-воркеры:

Chrome;
Android Chrome;
Opera;
Safari;
iOS Safari;
Edge;
Firefox.

Найти элементы, которые требуется скрыть от поисковой системы;
Если такие элементы есть, то передать задачу в отдел разработки и оповестить про способы реализации на практике;
Протестировать работу на примере одного документа путем использования программного решения Chrome Dev Tools или путем анализа кеша страницы в Google после индексации.

Вопросы и ответы

Есть ли официальные заявления о том, что Google действительно не поддерживает сервис-воркеры

Да, такие заявление являются публичными и есть на видео.

Зачем нужны сервис-воркеры?

На сайтах серивс-воркеры используют для разных целей. Например, для адаптации сайта под ситуацию с прерванным доступом к интернету.

Если интернет пропал, то при использовании сервис-воркеров сайты могут вести себя как приложения на мобильных устройствах, то есть отдавать уже скачанный контент и сигнализировать о необходимости подключения.

На практике сервис-воркеры используются еще и для кеширования изображений.

Еще используя сервис-воркеры можно сохранять данные заполненных форм и отправлять их в интернет при появлении подключения. Для реализации используется Background Sync API. Цепь следующая:

Еще сервис-воркеры вместе с Content-Length и Range можно использовать для загрузки больших файлов частями. Например, так можно защищать видео от копирования.

Еще сервис-воркеры используются для отправки push уведомлений.

Кстати, сервис-воркеры продолжают работать даже когда окно браузера закрыто.

Кто использует сервис-воркеры?

Например сервис-воркеры используются на таких сайтах как:

Google;
YouTube;
Twitter;
Booking;
Facebook;
Washington Post;

Как скрыть весь сайт от поисковых систем?

В редких случаях сайты полностью могут быть закрыты от поисковых роботов. Например так защищают площадки от Роскомнадзора при продвижении сайтов различных спортивных тематик. Если стоит задача скрыть всю страницу или весь сайт от конкретных роботов, то наиболее эффективный способ заключается в запрете индексации на уровне сервера. Рекомендованный материал в блоге MegaIndex по теме защиты сайта от парсинга различными роботами по ссылке далее — Эффективные способы защиты от парсинга сайта.

Кстати, краулер MegaIndex индексирует больше ссылок за счет того, что для робота MegaIndex доступ к сайтам не закрыт.

Почему так происходит? Поисковые оптимизаторы используют различные плагины для того, чтобы закрыть ссылки от таких сервисов как SEMrush, Majestic, Ahrefs. В таких плагинах используются черные списки. Если вести речь про глобальный рынок, то MegaIndex является менее расхожим сервисом, и поэтому часто краулер MegaIndex не входит в черный список. Как результат, применяя сервис MegaIndex у поисковых оптимизаторов есть возможность найти те ссылки, которые не находят другие сервисы.

Еще выгрузку ссылок можно провести посредством API. Полный список методов доступен по ссылке — MegaIndex API. Метод для выгрузки внешних ссылок называется backlinks. Ссылка на описание метода — метод backlinks.

Выводы

С обновлением Googlebot скрыть ссылки, текст и другие части страниц сайта от поисковой системы стало сложнее, но лазейки есть. Поисковый движок рендеринга по прежнему не поддерживает сервис-воркеры.

Используя service workers с запросами можно проводить следующие манипуляции:

Читайте также: