» »

Абстрактный Вид материала файлов для uCoz


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

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

Вид:

Код
<div class="h_mtr">  
<div class="h_mtr_in">  
<div class="h_mtr_image"> <div class="h_mtr_image_over"><a href="$IMG_URL1$" class="ulightbox" target="_blank"><img src="$IMG_URL1$" alt="$TITLE$"></a></div> </div>  
<div class="h_mtr_content">  
<h2 class="h_mtr_title"><a href="$ENTRY_URL$">$TITLE$</a></h2>  
<hr>  

<div class="h_mtr_date">  
<span class="hm_d hm_date">$DATE$ в $TIME$</span>  
<span class="hm_d hm_user"><a href="$PROFILE_URL$">$USERNAME$</a></span>  
<span class="hm_d hm_views">$READS$</span>  
<span class="hm_d hm_comm"><a href="$COMMENTS_URL$">$COMMENTS_NUM$</a></span>  
<span class="hm_d hm_cat"><a href="$CATEGORY_URL$">$CATEGORY_NAME$</a></span>  
</div>  
<hr>  
<div class="h_mtr_text post-d">$MESSAGE$</div>  
<hr>  
</div>  
</div>  
</div>


CSS:

Код
.h_mtr{margin-bottom:30px;}  
.h_mtr_in{display:table;width:100%;}  
.h_mtr_image{display:table-cell;vertical-align:top;width:300px;}  
.h_mtr_content{display:table-cell;vertical-align:top}  
.h_mtr_image_over{width:270px;height:230px;}  
.h_mtr_image_over{object-fit: cover; border: 4px solid #FCFCFC; box-shadow: 0px 0px 1px 1px #DDD;}  
.h_mtr_image_over img{width:270px;height:230px;object-fit:cover;}  
.h_mtr_image_over a:hover img{opacity:0.7;}  
.dir_foto_image{display:table-cell;vertical-align:top;width:825px;}  
.dir_foto{width:825px;height:470px;}  
.dir_foto img{width:825px;height:470px;object-fit:cover;}  
.dir_foto a:hover img {opacity:0.7;}  
.h_mtr_title{font-size: 19px; font-family: serif; font-weight: bold}  
.h_mtr_title_mat{font-size:20px;font-family:'Lora',sans-serif;font-weight:bold;margin-bottom:10px;}  
.h_mtr_text{text-align:justify;color:#636363;max-height: 110px; overflow: hidden;}  
.h_mtr_date{margin-top:12px;font-size:14px;color:#818181;}  
.h_mtr_date a{color:#818181}  
.hm_d{display:inline-block;padding-left:22px;padding-right:10px;}  
.hm_date{background:url('http://zornet.ru/Ajaxoskrip/Forma_skriptov/tygsa/i_time.png') 0px 1px no-repeat;}  
.hm_user{background:url('http://zornet.ru/Ajaxoskrip/Forma_skriptov/tygsa/i_user.png') 0px 1px no-repeat;}  
.hm_views{background:url('http://zornet.ru/Ajaxoskrip/Forma_skriptov/tygsa/i_views.png') 0px 1px no-repeat;}  
.hm_comm{background:url('http://zornet.ru/Ajaxoskrip/Forma_skriptov/tygsa/i_comm.png') 0px 1px no-repeat;}  
.hm_cat{background:url('http://zornet.ru/Ajaxoskrip/Forma_skriptov/tygsa/i_cat.png') 0px 1px no-repeat;}

Вид материала для uCoz



На сайте, здесь изначально стоит этот код, просто он был доработан по дизайну. Как можно заметить, что основная картинка не растянута, и не доходит до конца. Но по гуглу дает добро, что все нормально. Просто нужно в стилях выставить стили по размерам. Сильно в этом не понимаю, как адаптируют, но здесь так же было и только стили исправили, это что под мобильное устройства, под все остальные, смотрится корректно по актуализаций.
06.10.2015 Просмотров: 433 Комментарий: (17)

Поделиться в социальных сетях

Материал разместил

Комментарий: 17
Сопрано
Сопрано 06.10.2015 23:181
0
Здорово смотрится, на счет адаптаций вообще не задумываюсь, так как на сайт с мобильных устройств почти не кто не заходит кроме меня. У меня такой вопрос, вы сказали такой же вид как на zorner, но он явно немного похоже. И можно рамку сделать под свой цвет.
AnTron
AnTron 06.10.2015 23:242
0
Trantel, дам вам небольшой совет, который как понимаю вы не знаете. Если есть у вас Хром - браузер, так вот зайдите с него, и там кликом наводите на любой элемент дизайна в нашем случай рамка и правый клик и там будет в самом низу написано " Просмотр кода элемента" вот жмем туда и внизу вам откроется этот элемент и под него стили, но вы там разберетесь.

Этот вид, могу ошибаться или что то похоже видел на этом сайте.
Сопрано
Сопрано 06.10.2015 23:283
0
AnTron, спасибо, но давно знал, просто не вникал в эту тему, с кодами еще могу разобраться, но некоторые стили идут под номерами не из CSS а как понимаю из файла.
Kosten
Kosten 06.10.2015 23:334
0
AnTron, возможно вы видели, но там соглашусь по кодам почти такой же и стилями вид материала но он изначально шел как помню без обвода или рамки на изображение и мне пришлось ее делать. А так полностью согласен, что они похоже, только тот доработан по дизайну, но не адаптирован, этот намного лучше под мобильные изначально сделан, но не полностью.
AnTron
AnTron 06.10.2015 23:405
0
Kosten, мня дико иногда смешит, что некоторые делают адаптацию и так все сорвались, что им письмо пришло от поисковой системы гугл. Вы хоть иногда к ним на форум зайдите и задайте вопрос, к примеру когда будут понижать позиций или, что сделал адаптацию и теперь мой позиций полезут вверх. Вы получите размытый ответ, который будет для всех ясен и в тоже время не понятен, это к примеру, вот время придет и все увидите. Что мы увидим, да не чего, не понижение и не взлет, напугали народ, не одного в интернете на площадках не видел, чтоб кто то написал, что упали хосты в гугл, так как сайт не адаптирован.

Просто если вас читают и смотрят с мобильных устройств, то вам нужно обязательно делать адаптацию, так как нужно уважать своего читателя, если пару человек в сутки зайдут, то задумайтесь, а оно вам надо.
Canon
Canon 06.10.2015 23:436
0
Это может так сказать, тот человек у которого своего сайта нет и на все забить и не к чему не прислушиваться.
AnTron
AnTron 06.10.2015 23:487
0
Canon, почему у вас такие выводы. Если меня поправили предоставить свой сайт я этого не сделал, это мне решать и здесь не нужно на это ссылаться.

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

Вы можете представить сколько это работы, могу только так сказать, если только будут поступать жалобы, на сайт, что не отображается как нужно в мобильнике, то в этом случай они могут и понизить и вам не сообщат. Но к вам не кто не заходит, или будет заходит до пяти человек и все напишут жалобы, то думаю это будет мало.
Kosten
Kosten 06.10.2015 23:549
0
Основная адаптация идет на вид материала и где комментарий к нему находиться. Сейчас все новые шаблоны идут полностью адаптированные, если вы поставите вид материала, то его нужно доводить, так как еще почти нет его в интернете, что поставил и все нормально. Это как уже говорил, все делают после установки.

Вот небольшая адаптация, как убрать не нужные элементы, чтоб не отражались в мобильных устройств. Вы можете сделать сами и сохранить деньги и потом останется дать профессионалу и он быстро доведет как нужно.
Сопрано
Сопрано 06.10.2015 23:5810
0
Kosten, это вообще хорошая вещь, в интернете не найти, надписи все лишнй в низ сайта и баннеры по убирал. На широком экране они есть, а вот на мобильных устройствах уже нет в дизайне.
AnTron
AnTron 07.10.2015 00:0311
0
Но почему вы так говорите, что не найти, видать плохо искали. Просто нужные ресурсы знать а не надеется на поисковую систему. Просто иногда можно зайти к примеру на блог uCoz и там в поиске прописать, возможно кто и задавал вопрос, раньше они отправляли на платные шаблоны, сейчас стали больше помогать и отвечать на поставленный правильно вопрос, видать время прошло, но иногда посылают на площадку, где можно купить уже полностью адаптированый шаблон. Но только редко можно найти, тот который нужен.
kos
kos 06.10.2015 23:518
+1
Отлично сделано wink
Kosten
Kosten 07.10.2015 00:0612
0
kos, такой крепко стандартный вид, где не чего лишнего.
Zismo-vk
Zismo-vk 07.10.2015 00:3413
0
Я сижу здесь через телефон и мне норм.какая в**** адаптацыя.
Kosten
Kosten 07.10.2015 01:0014
0
Zismo-vk, корректно все видно или есть какие то погрешности, чтоб можно было убрать. Просто у меня мобила древняя, не кумарю по ним. А вот в компьютера нормально и с планшета также.
Zismo-vk
Zismo-vk 07.10.2015 01:0715
0
Незнаю мне все нормально видно,кривоты нет а значит все нормально.
Kosten
Kosten 07.10.2015 01:0916
0
Zismo-vk, спасибо за реальный просмотр.
Zismo-vk
Zismo-vk 07.10.2015 01:1417
0
Всегда пожалуйста оброщайся если нужно будет.
avatar