За блог на платформата Blogger (blogspot). Създаване, водене, персонализиране, дизайн, притурки в примери. Препоръки и съвети за начинаещи и напреднали блогъри.

Търсене

Breaking

Първото изображение в публикацията само на главната страница

Първото изображение в публикацията
Как да направим така, че първото от изображенията в публикацията да се показва само на главната страница.
Здравейте, скъпи приятели, читатели и посетители на блога. Искате ли да направите така, че първото изображение в една публикация да се показва само на главната страница, а в самата публикация да не се вижда? Това е един малък трик с изображенията, който искам да ви предложа днес. Без каквото и да е било вмешателство в темата на блога.

Единственото условие да работи този трик е да направите връзката "прочети повече" автоматична. Как да стане това съм написала в тази публикация. Моля, припомнете си я. Съветвам ви също да си припомните как да работим правилно с изображенията в нашия блог.
За да стане по-ясно за какво става дума, погледнете по-внимателно публикациите на първата страница в другия ми блог "Библиотека Пъстри халища". Изображенията в публикациите се показва нормално на главната страница. А когато преминете към страницата на която и да е от тях, там ги няма.
Тук принципът на работа е съвършено прост. Ако се върнете към публикацията "Как да работим с изображенията в блога", там всичко е описано. Но отново на кратко. Необходимо е по нормален начин да вградите първото изображение в публикацията и да преминете в HTML режим. Целият код на изображението ще изглежда по следния начин:

<div class="separator" style="clear: both; text-align: center;">
<a href="http://s018.radikal.ru/i503/1511/bd/ab7527b521d8.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://s018.radikal.ru/i503/1511/bd/ab7527b521d8.jpg" height="130" width="200" /></a></div>

Тази част от него, която е оцветена в червено внимателно отстранете и в крайна сметка кодът е такъв:

<div class="separator" style="clear: both; text-align: center;"><img border="0" src="http://s018.radikal.ru/i503/1511/bd/ab7527b521d8.jpg" height="130" 
width="200" /></div>

Остава малко да отредактираме кода, за да се постигне ефекта, за който говорим днес. Отменяме ефекта на свойството clear. Просто трябва да се промени значението clear: на display:none; Тогава кодът ще изглежда така:

<div class="separator" style=" display:none;both; text-align: center;"><img border="0" src="http://s018.radikal.ru/i503/1511/bd/ab7527b521d8.jpg" height="130" 
width="200" /></div>

Ако сега се върнем обратно към режима на създаване на публикацията, изображението не се вижда. Въпреки това, след публикуването й то ще се появи на главната страница. А в самата публикация изображението го няма.

Благодаря за вниманието и доскоро.

Здраве за всички вас! Не забравяйте да правите добро на други хора!

Ще съм благодарна да оцените моя труд и кликнете върху звездичките по-долу. Или гласувайте за блога на:

BGtop

Няма коментари:

Публикуване на коментар