• Страница 1 из 1
  • 1
Модератор форума: -SAM-  
Есть тема на исправление вид материала
Kosten
Понедельник, 06 Января 2014, 15:44 | Сообщение 1
Оффлайн
Администраторы
Сообщений:44490
Награды: 70
Всем привет. Давайте кто в теме сделаем вид материала и комментариев более понятливо. А точнее поставить кнопку скачать если файл залит и пользователь зарегистрирован на сайте то кнопку видно и можно скачать. И если файл не залит то просто или нет кнопки или кнопка "назад" думаю вид намного лучше станет.
Картинку я уменьшил на фотошопе и по стилям подогнал вот только кнопка осталась.
Сам вид: http://ucoz-css.ru/load/kak_sozdat_sajt_na_sisteme_ucoz/1-1-0-9

КАРТИНКА:


Как то всю писанину убрать и сделать проще как описал.. думаю это возможно wink

Сам код вид материала и комментария файла:
Код
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head>

<title>$TITLE$</title>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link type="text/css" rel="StyleSheet" href="/_st/my.css" />
<link rel="alternate" type="application/rss+xml" title="Sitemap XML" href="/sitemap.xml">
<link type="text/css" rel="StyleSheet" href="http://s3.ucoz.net/src/layer3.css">
<script type="text/javascript" src="http://s3.ucoz.net/src/jquery-1.7.2.js"></script>
<link href="http://s3.ucoz.net/src/ulightbox/ulightbox.css" rel="stylesheet" type="text/css"><script type="text/javascript" src="http://s3.ucoz.net/src/ulightbox/ulightbox.js"></script>
<script type="text/javascript" src="http://s3.ucoz.net/src/uwnd.js?2"></script><style type="text/css">.UhideBlockL {display:none}</style>
</head>

<body>

$GLOBAL_AHEADER$
<!-- <middle> -->
  <div id="side_left">
  $GLOBAL_CLEFTER$
  </div><!--/side_left-->
  <div id="side_right">
  <form id="searchbox" onsubmit="this.sfSbm.disabled=true" method="get" action="/search/">
  <input id="searchput" type="text" name="q" value="поиск по сайту" onblur="if(this.value=='')this.value='поиск по сайту'" onfocus="if(this.value=='поиск по сайту')this.value=''">
  <input id="submitbtn" type="submit" name="sfSbm" value="L">
  </form>
$GLOBAL_DRIGHTER$
  </div><!--/side_right-->
  <div id="side_center" class="sider_left_full">
<!-- <body> -->
$GLOBAL_CONTENER$<!-- <body> --><table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody><tr>
<td width="80%"><a href="$HOME_PAGE_LINK$"><!--<s5176>-->Главная<!--</s>--></a> » <a href="$MODULE_URL$"><!--<s5182>-->Файлы<!--</s>--></a> <?if($SECTION_NAME$)?>» <a href="$SECTION_URL$">$SECTION_NAME$</a><?endif?> » <a href="$CAT_URL$">$CAT_NAME$</a></td>
<td align="right" style="white-space: nowrap;"><?if($ADD_ENTRY_LINK$)?>[ <a href="$ADD_ENTRY_LINK$"><!--<s5186>-->Добавить материал<!--</s>--></a> ]<?endif?></td>
</tr>
</tbody></table>
<hr>
<div class="viewn_loop">
  <div class="viewn_t">
  <div class="viewn_t_in">
  <div class="viewn_title">
  <h5>$ENTRY_TITLE$</h5>
  </div>
  </div>
  </div>
  <div class="viewn_c">
  <div class="viewn_c_in">
  <div class="viewn_c_in2">
  <div class="viewn_detail">
  <div class="right">Добавил: <a href="$PROFILE_URL$"><b>$USER$</b></a> » Дата: <span title="$TIME$">$DATE$</span></div>
  Категория: <a href="$CAT_URL$">$CAT_NAME$</a>
  </div>
  <div class="hr_v"></div>
  <div class="viewn_cont">
  <div class="viewn_l">
  <img id="img$UID$" src="$IMG_URL1$" style="max-height:200;" alt="$TITLE$">
  <script type="text/javascript">  
  $(function(){  
  $('#img$UID$').click(function(){var s="'sc'";  
  new _uWnd('sc','Реальный размер',100,100,{autosize:1,shadow:1,autosizeonimages:1,header:0},'<img src="'+$(this).attr('src')+'" align="center" alt="" onclick="_uWnd.close('+s+')" style="cursor:pointer;">');});  
  });  
  </script>
  </div>
  <div class="viewn_r">
  $MESSAGE$
   

   
  [ <a href="$FILE_URL$"><strong style="font-size:13px;">Скачать $ENTRY_TITLE$</strong></a> ]<br>
  [ <a href="$RFILE_URL$"><strong style="font-size:13px;">Скачать $ENTRY_TITLE$</strong></a> ]<br>
  [ <a href="$IMG_URL1$" target="_blank">Скриншот</a> ·  
   
   
  <a title="Репутация пользователя автоматически повысится. Многократное нажатие Спасибо запрещено Правилами портала и строго наказывается!" href="javascript://" onclick="openLayerB('Rd',0,'$HOME_PAGE_LINK$index/23-$UID$','Change Reputation',380,200,1); return false;" style="color:#0D6DBA;">Поблагодарить</a><font color="#00bfff"> </font>·
  <a href="javascript://" onclick="complaint('STrannik')" style="color:#ff4c4c;">Жаловаться</a>  
  ]
   
   

   
   

  Источник: $SOURCE_URL$
  <br><b>Метки:</b> <noindex>$TAGS$</noindex>

  </div>
  </div>
  <div class="hr_v2"></div>
  <div class="viewn_detail v_detail_b">
  <?if($RATING$)?><div style="float:right"><?$RSTARS$('12','/.s/img/stars/3/12.png','1','float')?></div><?endif?>
  Просмотров: $READS$ | Загрузок: $LOADS$ | Комментариев: $COMMENTS_NUM$ $MODER_PANEL$
  </div>
  </div>
  </div>
  </div>
  <b class="viewn_b"><b></b></b>
</div>
<div align="center"><a href="/forum" alt="Форум для дизайнеров и веб мастеров"><img src="/banner.gif"></a></div><br>
<div class="viewn_loop">
  <div class="viewn_t">
  <div class="viewn_t_in">
  <div class="viewn_title">Так же мы рекомендуем</div>
  </div>
  </div>
  <div class="viewn_c">
  <div class="viewn_c_in">
  <div class="viewn_c_in2">
  <div class="viewn_detail">
  <div class="viewn_r">
<table align="center" border="0" cellspacing="0" cellpadding="0" width="100%" class="infTable"><tbody><tr><td class="infTd" width="25%">$MYINF_5$</td></tr></tbody></table>
<p></p>
  </div>
  </div>
  <div class="viewn_detail v_detail_b">

  </div>
  </div>
  </div>
  </div>
  <b class="viewn_b"><b></b></b>
</div>
<?if($COM_IS_ACTIVE$)?>
<?if($COM_CAN_READ$)?>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody><tr><td width="60%" height="25"><!--<s5183>-->Всего комментариев<!--</s>-->: <b>$COM_NUM_ENTRIES$</b></td><td align="right" height="25">$COM_PAGE_SELECTOR$</td></tr>
<tr><td colspan="2">$COM_BODY$</td></tr>
<tr><td colspan="2" align="center">$COM_PAGE_SELECTOR1$</td></tr>
<tr><td colspan="2" height="10"></td></tr>
</tbody></table>
<?endif?>

<?if($COM_CAN_ADD$)?>
$COM_ADD_FORM$
<?else?>
<?if($USER_LOGGED_IN$)?><?else?><div align="center" class="commReg"><!--<s5237>-->Добавлять комментарии могут только зарегистрированные пользователи.<!--</s>-->
[ <a href="$REGISTER_LINK$"><!--<s3089>-->Регистрация<!--</s>--></a> | <a href="$LOGIN_LINK$"><!--<s3087>-->Вход<!--</s>--></a> ]</div><?endif?>
<?endif?>
<?endif?><!-- </body> -->
<!-- </body> -->
  </div><!--/side_center-->
<!-- </middle> -->
$GLOBAL_BFOOTER$

<script>
$('#pagesBlock1').hide();
</script>
</body></html>
Прикрепления: 4566636.jpg (168.4 Kb)
Страна: (RU)
Kosten
Понедельник, 06 Января 2014, 16:33 | Сообщение 2
Оффлайн
Администраторы
Сообщений:44490
Награды: 70
Нашел альтернативу всему написанию которое вообщем не нужно. Думаю лучше смотрится.



Сам код кнопок:
Первое что нужно сделать, это прописать стиль в CSS в самый из.
Код
/* Adaptations by coffee aka mozila aka ololowka */   
   .mknop {   
   display: inline-block;   
   margin: 10px 0px;   
   height: 30px;   
   border: 1px solid #419DB8;   
   border-radius: 5px;   
   box-shadow: inset 0px 1px 0px #7ACBE3, 0px 1px 0px 0px #fff, 0px 2px 4px 0px #90C9D8;   
   background: #58bedc;   
   background: -moz-linear-gradient(top, #58bedc 11%, #3097b5 100%);   
   background: -webkit-gradient(linear, left top, left bottom, color-stop(11%,#58bedc), color-stop(100%,#3097b5));   
   background: -webkit-linear-gradient(top, #58bedc 11%,#3097b5 100%);   
   background: -o-linear-gradient(top, #58bedc 11%,#3097b5 100%);   
   background: -ms-linear-gradient(top, #58bedc 11%,#3097b5 100%);   
   background: linear-gradient(to bottom, #58bedc 11%,#3097b5 100%);   
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#58bedc', endColorstr='#3097b5',GradientType=0 );   
   }   

   .mknop:hover {   
   display: inline-block;   
   margin: 10px 0px;   
   height: 30px;   
   border: 1px solid #419DB8;   
   border-radius: 5px;   
   box-shadow: inset 0px 1px 0px #7ACBE3, 0px 1px 0px 0px #fff, 0px 2px 4px 0px #2186A2;   
   background: #58bedc;   
   background: -moz-linear-gradient(top, #58bedc 11%, #21819D 100%);   
   background: -webkit-gradient(linear, left top, left bottom, color-stop(11%,#58bedc), color-stop(100%,#21819D));   
   background: -webkit-linear-gradient(top, #58bedc 11%,#21819D 100%);   
   background: -o-linear-gradient(top, #58bedc 11%,#21819D 100%);   
   background: -ms-linear-gradient(top, #58bedc 11%,#21819D 100%);   
   background: linear-gradient(to bottom, #58bedc 11%,#21819D 100%);   
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#58bedc', endColorstr='#21819D',GradientType=0 );   
   }   

   .mknoplink {   
   padding: 2px 8px;   
   display: inline-block;   
   background: #efefef;   
   background: -moz-linear-gradient(top, #efefef 0%, #dbdbdb 100%);   
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#efefef), color-stop(100%,#dbdbdb));   
   background: -webkit-linear-gradient(top, #efefef 0%,#dbdbdb 100%);   
   background: -o-linear-gradient(top, #efefef 0%,#dbdbdb 100%);   
   background: -ms-linear-gradient(top, #efefef 0%,#dbdbdb 100%);   
   background: linear-gradient(to bottom, #efefef 0%,#dbdbdb 100%);   
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efefef', endColorstr='#dbdbdb',GradientType=0 );   
   box-shadow: inset 0px 1px 0px #fff,0px 1px 0px #E5E5E5;   
   border-radius: 3px;   

   text-shadow: 0px 1px 0px #fff;   
   margin: 4px 10px 0px 5px;   
   color: #15586A;   
   font: 14px Arial;   
   }   

   .mknopsize {   
   margin: 0px 10px 0px 7px;   
   display: inline-block;   
   padding: 2px 5px;   
   background: #1A6479;   
   box-shadow: inset 0px 1px 2px #0A4352, 0px 1px 0px #48C1E3;   
   border-radius: 3px;   
   color: #C9F5FF;   
   text-shadow: 0px -1px 0px #0D3E4B;   

   }   

   .mknopdownload {   
   display: inline-block;   
   color: #D6F7FF;   
   text-shadow: 0px -1px 0px #1A6479;   
   }   

   .mknopcifr {   
   margin: 0px 5px 0px 5px;   
   display: inline-block;   
   padding: 2px 5px;   
   background: #1A6479;   
   box-shadow: inset 0px 1px 2px #0A4352, 0px 1px 0px #48C1E3;   
   border-radius: 3px;   
   color: #C9F5FF;   
   text-shadow: 0px -1px 0px #0D3E4B;   
   }   
   .mknorazt {   
   display: inline-block;   
   color: #D6F7FF;   
   text-shadow: 0px -1px 0px #1A6479;   
   }   
   /* ------ */

Потом в вид материалов и комментариев к нему, убрать старую копку или надпись с кодом скачать и прописать этот код.
Код
<?if($FILE_URL$)?><a href="$FILE_URL$"><div class="mknop"><div class="mknoplink"><?substr($FILE_DIRECT_URL$,27,20)?></div><?if($FILE_SIZE$)?><div class="mknorazt">Вес:</div><div class="mknopsize">$FILE_SIZE$</div><?endif?><div class="mknopdownload">Загрузок: <div class="mknopcifr">$LOADS$</div></div></div></a><?endif?>   
   <?if($RFILE_URL$)?><a href="$RFILE_URL$"><div class="mknop"><div class="mknoplink">Скачать файл</div><?if($FILE_SIZE$)?><div class="mknorazt">Вес:</div><div class="mknopsize">$FILE_SIZE$</div><?endif?><div class="mknopdownload">Загрузок: <div class="mknopcifr">$LOADS$</div></div></div></a><?endif?>

И все получается шикарно.
Прикрепления: 7016639.jpg (161.3 Kb)
Страна: (RU)
Kosten
Понедельник, 06 Января 2014, 16:36 | Сообщение 3
Оффлайн
Администраторы
Сообщений:44490
Награды: 70
Только одно нужно в этот код прописать скрипт. Что кто не зарегистрировался при нажатие чтоб не происходило скачивание а вылезало яхо окно о регистраций.
Как сделать и привинтить к этому коду.
Код
<?if($FILE_URL$)?><a href="$FILE_URL$"><div class="mknop"><div class="mknoplink"><?substr($FILE_DIRECT_URL$,27,20)?></div><?if($FILE_SIZE$)?><div class="mknorazt">Вес:</div><div class="mknopsize">$FILE_SIZE$</div><?endif?><div class="mknopdownload">Загрузок: <div class="mknopcifr">$LOADS$</div></div></div></a><?endif?>    
    <?if($RFILE_URL$)?><a href="$RFILE_URL$"><div class="mknop"><div class="mknoplink">Скачать файл</div><?if($FILE_SIZE$)?><div class="mknorazt">Вес:</div><div class="mknopsize">$FILE_SIZE$</div><?endif?><div class="mknopdownload">Загрузок: <div class="mknopcifr">$LOADS$</div></div></div></a><?endif?>


И вот так как то получилось. С вмешательством фотошопа, это сделать окно немного меньше, то как по мне оно большое и вид большой выходит. Сейчас в самый раз.



И вид материала и комментариев, думаю кнопки намного лучше чем надписи.



Све можно сделать самому, если есть у ка го вопросы, отвечу что знаю.
Прикрепления: 6332049.jpg (58.2 Kb) · 0428171.jpg (95.3 Kb)
Страна: (RU)
Ruslanа
Понедельник, 24 Марта 2014, 21:24 | Сообщение 4
Оффлайн
Пользователи
Сообщений:1
Награды: 0
А вот и до красивых кнопочек добрались.
Страна: (UA)
Kosten
Вторник, 25 Марта 2014, 00:19 | Сообщение 5
Оффлайн
Администраторы
Сообщений:44490
Награды: 70
Ruslanа, что так понравилось) biggrin
Страна: (RU)
  • Страница 1 из 1
  • 1
Поиск: