Css на сайте на ворд пресс

[ProfitBringer]

Добрый день помогите пожалуйста нубному нубу! Хочу реализовать блоки на странице т.е должно выглядеть как 3 столбика картинок, на картинку жмёшь а там по ссылке в описание, разжуйте подробно пожалуйста с примером, куда этот код вставлять и как???

добавлено через 14 минут
Вот теперь могу пример этого сайта показать http://xn--e1afgbgom0e.xn--p1ai/breeds/ примерно так же хочу, а этот сайт по которому я так сказать пытаюсь это сделать http://starper55plys.ru/css/otdelnye-bloki/

 

Реклама: ⭐ Wolfstreet.Cash: Обменник | QR-коды Tinkoff и Сбер | Прием Рублей | Наличные курьером

[MakarGesha]

Вам нужно в коде вставить картинки и на каждую картинку нужно поставить ссылку на категорию. Прежде нужно создать категории. Если вы совершенно не понимаете в html то вам на словах это не объяснишь.

 

Реклама: ⭐ Wolfstreet.Cash: Обменник | QR-коды Tinkoff и Сбер | Прием Рублей | Наличные курьером

[ProfitBringer]

Что такое категории? Это вроде рубрик, записи или страницы? Я планирую сделать на одной странице такое). Самые главные задачки понять в какой элемент страницы вставлять\заменять этот код отвечающий за блоки с фото, а так же если потребуется как подправить этот код что бы корректно работало всё). <div class="okno">
<p>Блок 1</p>
<p>Блок 2</p>
<p>Блок 3</p>
</div>
<div class="okno">
<p>Блок 4</p>
<p>Блок 5</p>
<p>Блок 6</p>
</div>
Это код который планирую вставить в код html-файла (php)
.okno {
display: inline;
width: 600px;
}

.okno p {
float: left;
font-family: Verdana;
padding: 10px;
font-size: 14px;
margin: 3px 3px 3px 5px;
width: 170px;
height: 200px;
border-radius: 5px;
box-shadow: rgba(0,0,0,5.2) 0px 1px 3px;
}
-Этот код в файл style.css
http://cats-funny.ru/?page_id=147 -тестовая страничка на которой должны быть блоки)
Я пробовал в админке сделать фотографии, но криво получается)

 

Реклама: ⭐ Wolfstreet.Cash: Обменник | QR-коды Tinkoff и Сбер | Прием Рублей | Наличные курьером

[Регина Голубева]

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

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

 

Реклама: ⭐ Wolfstreet.Cash: Обменник | QR-коды Tinkoff и Сбер | Прием Рублей | Наличные курьером

[ProfitBringer]

Регина расскажите пожалуйста поподробней о таблицах???)

 

Реклама: ⭐ Wolfstreet.Cash: Обменник | QR-коды Tinkoff и Сбер | Прием Рублей | Наличные курьером

[TananikaNikitoS]

Примерно так ну html придеться подучить
<table border="1" cellpadding="4" cellspacing="1">
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>

</table>

 

Реклама: ⭐ Wolfstreet.Cash: Обменник | QR-коды Tinkoff и Сбер | Прием Рублей | Наличные курьером

[Tapal-lapaT]

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

 

Реклама: ⭐ Wolfstreet.Cash: Обменник | QR-коды Tinkoff и Сбер | Прием Рублей | Наличные курьером

[ProfitBringer]

Очень не плохо спасибо, табличка получилась, теперь вопрос как грамотно вставить туда фотографии и подписать их??) Фото я так понял надо в самом начале уже редактировать(ширину,высоту) потом уже на сайт загружать и в таблицу?
Хех средняя фотка чуть ниже других получилась)))
А да и ещё значения border="1" и cellspacing="1" ставлю на 0, но сетка всё равно видна, -это уже надо что-то менять в файле шаблона style.css???)

 

Реклама: ⭐ Wolfstreet.Cash: Обменник | QR-коды Tinkoff и Сбер | Прием Рублей | Наличные курьером

[ProstoSlava]

Размер фото задавайте прежде чем загрузить на сайт. Фото стало ниже других - удалите везде   это пробел именно из-за этого фотографии не равномерно. Удалите border="1" cellpadding="4" cellspacing="1" если ничего не получится нужно лесть в css

 

Реклама: ⭐ Wolfstreet.Cash: Обменник | QR-коды Tinkoff и Сбер | Прием Рублей | Наличные курьером

[BaaruukaaVlaadooss]

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

добавлено через 5 минут
.table {
border: 0;
cellpadding: 0;
cellspacing:0;
}

Потом делаем следующее, это уже там где ваша таблица
<div class="table">
здесь вставляете код таблицы
</div>

добавлено через 6 минут
если не получится, вставьте этот класс в таблицу <table class="table">

 

Реклама: ⭐ Wolfstreet.Cash: Обменник | QR-коды Tinkoff и Сбер | Прием Рублей | Наличные курьером

[ProfitBringer]

Не помогло, что-то не так сделал! Зато блоки теперь получились и проблем пока не видать))
Спасибо!)

 

Реклама: ⭐ Wolfstreet.Cash: Обменник | QR-коды Tinkoff и Сбер | Прием Рублей | Наличные курьером

[ProstoSlava]

А как блоки получились, таблицами или div делали?

Спрашивайте будем дальше помогать.

 

Реклама: ⭐ Wolfstreet.Cash: Обменник | QR-коды Tinkoff и Сбер | Прием Рублей | Наличные курьером

[ProfitBringer]

Спасибо, сегодня, завтра и точно после завтра я буду этим заниматься более подробно напишу)
а так я просто в прошлый раз не туда код вставлял! Надо было в админке=> редактировать (код файла style.css) а потом там где уже "добавить запись", где текст вставить другой код, видимо это код html был).
А я либо весь код в текст запихивал либо в файл style.css!

 

Реклама: ⭐ Wolfstreet.Cash: Обменник | QR-коды Tinkoff и Сбер | Прием Рублей | Наличные курьером

[ProfitBringer]

Это в файлик стиль, в начало после описания автора темы
.okno {
display: inline;
width: 600px;
}

.okno p {
float: left;
font-family: Verdana;
padding: 10px;
font-size: 14px;
margin: 0px 0px 0px 0px;
width: 170px;
height: 200px;
border-radius: 0px;
box-shadow: rgba(0,0,0,5) 0px 1px 3px;
}

а это в "текст" в записях
<div class="okno">
<p class="okno">Блок 1</p>
<p class="okno">Блок 2</p>
<p class="okno">Блок 3</p>
</div>
<div class="okno">
<p class="okno">Блок 4</p>
<p class="okno">Блок 5</p>
<p class="okno">Блок 6</p>
</div>
и всё получилось, все готово)))

 

Реклама: ⭐ Wolfstreet.Cash: Обменник | QR-коды Tinkoff и Сбер | Прием Рублей | Наличные курьером