Úpravy prosilver stylu

Skladiště návodů, postupů a tutoriálů k phpBB 2.0.x, phpBB 3.0.x a modifikacím.
Kamahl
Příspěvky: 1713
Registrován: ned 25. bře 2007 1:00:00
Bydliště: Bratislava
Kontaktovat uživatele:

Úpravy prosilver stylu

Příspěvek od Kamahl » stř 06. úno 2008 23:38:35

Do tejto témy budem postupne pridávať rôzne návody na zmeny v prosilvere. Pred prepisovaním súborov ich zálohujte. Nezabudnite premazať cache.

Zoznam úprav:
  1. Zmena farby pozadia neprečítanej témy
  2. Zmena farby pozadia
  3. Pridanie ohraničenia fóra, ako napríklad na phpbb.com
  4. Zmena farby pozadia po nainštalovaní ohraničenia
  5. Zmena šírky fóra po pridaní ohraničenia
  6. Spojenie "Kto je online" a "Štatistiky"
  7. Zmena Online img v rohu za online/offline img nad avatarom
  8. Upozornenie na novu súkromnú správu
  9. Profil na ľavej strane
  10. Menu z tabov
  11. Pridanie obrázku do pozadia textarey pri písaní príspevkov
  12. Fix png obrazkov v IE
  13. Reklamný box za prvým príspevkom
  14. Typ tématu před názvem
Zmena farby pozadia neprečítanej témy

Otvor : styles/prosilver/theme/colours.css
Nájdi :

Kód: Vybrat vše

.bg3   { background-color: #cadceb; }
Za to pridaj :

Kód: Vybrat vše

.bg4   { background-color: #bbd3e5; }
Otvor : styles/prosilver/template/viewforum_body.html
Nájdi :

Kód: Vybrat vše

<li class="row<!-- IF topicrow.S_ROW_COUNT is even --> bg1<!-- ELSE --> bg2<!-- ENDIF --><!-- IF topicrow.S_POST_ANNOUNCE --> announce<!-- ENDIF --><!-- IF topicrow.S_POST_STICKY --> sticky<!-- ENDIF --><!-- IF topicrow.S_TOPIC_REPORTED --> reported<!-- ENDIF -->">
Prepíš :

Kód: Vybrat vše

<li class="row<!-- IF topicrow.S_ROW_COUNT is even --> bg1<!-- ELSE --> bg2<!-- ENDIF --><!-- IF topicrow.S_UNREAD_TOPIC --><!-- IF topicrow.S_ROW_COUNT is even --> bg3<!-- ELSE --> bg4<!-- ENDIF --><!-- ENDIF --><!-- IF topicrow.S_POST_ANNOUNCE --> announce<!-- ENDIF --><!-- IF topicrow.S_POST_STICKY --> sticky<!-- ENDIF --><!-- IF topicrow.S_TOPIC_REPORTED --> reported<!-- ENDIF -->">
Naposledy upravil(a) Kamahl dne pát 08. úno 2008 18:30:23, celkem upraveno 6 x.

Kamahl
Příspěvky: 1713
Registrován: ned 25. bře 2007 1:00:00
Bydliště: Bratislava
Kontaktovat uživatele:

Re: Úpravy prosilver stylu

Příspěvek od Kamahl » stř 06. úno 2008 23:41:11

Zmena farby pozadia

Otvor : styles/prosilver/theme/colours.css
Nájdi :

Kód: Vybrat vše

html, body {
   color: #536482;
   background-color: #FFFFFF;
}
Zmeň hodnotu background-color: #FFFFFF;

Kamahl
Příspěvky: 1713
Registrován: ned 25. bře 2007 1:00:00
Bydliště: Bratislava
Kontaktovat uživatele:

Re: Úpravy prosilver stylu

Příspěvek od Kamahl » stř 06. úno 2008 23:54:25

Pridanie ohraničenia fóra, ako napríklad na phpbb.com

Stiahnite si border.rar a obsah vložte do styles/prosilver/theme/images/
border.rar
(31.62 KiB) Staženo 1154 x
Ďalej si stiahnite css_for_borders.rar a vložte do styles/prosilver/theme/
css_for_borders.rar
(1.47 KiB) Staženo 1080 x
Otvorte overall_header.html pre pridanie ohraničenia na vrch.
Nájdite :

Kód: Vybrat vše

<body id="phpbb" class="section-{SCRIPT_NAME} {S_CONTENT_DIRECTION}">
Za to pridajte do nového riadku :

Kód: Vybrat vše

<div class="outside">
   <div class="top-left"></div><div class="top-center"></div><div class="top-right"></div>
      <div class="inside">
         <div class="notopgap">
Teraz otvorte overall_footer.html pre pridanie ohraničenia na spodok stránky.
Nájdite :

Kód: Vybrat vše

<!-- IF not S_IS_BOT -->{RUN_CRON_TASK}<!-- ENDIF -->
</div>
Za to pridajte :

Kód: Vybrat vše

</div></div>
<div class="nobottomgap"></div>
      </div>
   <div class="bottom-left"></div><div class="bottom-center"></div><div class="bottom-right">
</div>
Po tejto úprave máte klasické ohraničenie. Neskôr si ukážeme úpravu šírky a ďalšie úpravy. Grafické zmeny môžete robiť napríklad vo photoshope, úpravou obrázkov z border.rar
Naposledy upravil(a) WhiteWolfSix dne stř 18. úno 2009 19:09:13, celkem upraveno 1 x.
Důvod: Opravený tag </div>

Kamahl
Příspěvky: 1713
Registrován: ned 25. bře 2007 1:00:00
Bydliště: Bratislava
Kontaktovat uživatele:

Re: Úpravy prosilver stylu

Příspěvek od Kamahl » čtv 07. úno 2008 0:03:42

Zmena farby pozadia po nainštalovaní ohraničenia

Tento postup je určen pouze pro fóra s již nainstalovanou úpravou pro ohraničení popsanou zde o pár příspěvků výše.

Otvorte : shoots_boarders.css
Nájdite :

Kód: Vybrat vše

html, body {
   color: #68696D;
   background-color: #A0A8AE;
/*    background-image: url("{T_THEME_PATH}/images/yourbg.gif");*/ /* CHANGE: path and name of your image */   
}
Prepíšte hodnotu #A0A8AE v background-color: #A0A8AE; za farbu ktorú chcete použiť. Kód farby nájdete napríklad vo photoshope

Kamahl
Příspěvky: 1713
Registrován: ned 25. bře 2007 1:00:00
Bydliště: Bratislava
Kontaktovat uživatele:

Re: Úpravy prosilver stylu

Příspěvek od Kamahl » čtv 07. úno 2008 0:11:07

Zmena šírky fóra po pridaní ohraničenia

Tento postup je určen pouze pro fóra s již nainstalovanou úpravou pro ohraničení popsanou zde o pár příspěvků výše.

Otvorte : shoots_boarders.css
Nájdite :

Kód: Vybrat vše

#wrap { 
   padding: 0 20px; 
   min-width: 700px; 
   width: 900px;
   margin: 0 auto;
Prepíšte hodnotu v min-width a width.

Ďalej nájdite :

Kód: Vybrat vše

.outside {
   margin: 0 auto;
   width : 950px;
   }
Prepíšte hodnotu width.

Otvorte images/bg_body.gif napríklad vo photoshope a upravte šírku z 950px o vami zmenenú hodnotu šírky fóra

Kamahl
Příspěvky: 1713
Registrován: ned 25. bře 2007 1:00:00
Bydliště: Bratislava
Kontaktovat uživatele:

Re: Úpravy prosilver stylu

Příspěvek od Kamahl » čtv 07. úno 2008 0:49:59

Spojenie "Kto je online" a "Štatistiky"

Touto úpravou spojíte Kto je online a štatistiky do jedného celku.

Otvorte : index_body.html

Nájdite a zmažte :

Kód: Vybrat vše

<!-- IF NEWEST_USER -->
	<h3>{L_STATISTICS}</h3>
	<p>{TOTAL_POSTS} &bull; {TOTAL_TOPICS} &bull; {TOTAL_USERS} &bull; {NEWEST_USER}</p>
<!-- ENDIF -->
Nájdite :

Kód: Vybrat vše

<!-- IF S_DISPLAY_ONLINE_LIST -->
	<!-- IF U_VIEWONLINE --><h3><a href="{U_VIEWONLINE}">{L_WHO_IS_ONLINE}</a></h3><!-- ELSE --><h3>{L_WHO_IS_ONLINE}</h3><!-- ENDIF -->
	<p>{TOTAL_USERS_ONLINE} ({L_ONLINE_EXPLAIN})<br />{RECORD_USERS}<br /> <br />{LOGGED_IN_USER_LIST}
	<!-- IF LEGEND --><br /><em>{L_LEGEND}: {LEGEND}</em><!-- ENDIF --></p>
<!-- ENDIF -->
Prepíšte s :

Kód: Vybrat vše

<!-- IF S_DISPLAY_ONLINE_LIST -->
   <!-- IF U_VIEWONLINE --><h3><a href="{U_VIEWONLINE}">{L_WHO_IS_ONLINE}</a></h3><!-- ELSE --><h3>{L_WHO_IS_ONLINE}</h3><!-- ENDIF -->
   <p>{TOTAL_USERS_ONLINE} ({L_ONLINE_EXPLAIN})<br />{RECORD_USERS}<br />
  <!-- IF NEWEST_USER -->{TOTAL_POSTS}. {TOTAL_TOPICS}. {TOTAL_USERS}. {NEWEST_USER}<br /><!-- ENDIF -->
  <br />{LOGGED_IN_USER_LIST}
   <!-- IF LEGEND --><br /><em>{L_LEGEND}: {LEGEND}</em><!-- ENDIF --></p>
<!-- ELSE -->
<!-- IF NEWEST_USER -->
   <h3>{L_STATISTICS}</h3>
   <p>{TOTAL_POSTS} &bull; {TOTAL_TOPICS} &bull; {TOTAL_USERS} &bull; {NEWEST_USER}</p>
<!-- ENDIF -->
<!-- ENDIF -->

Kamahl
Příspěvky: 1713
Registrován: ned 25. bře 2007 1:00:00
Bydliště: Bratislava
Kontaktovat uživatele:

Re: Úpravy prosilver stylu

Příspěvek od Kamahl » čtv 07. úno 2008 1:03:54

Zmena Online img v rohu za online/offline img nad avatarom

Otvorte : prosilver/template/viewtopic_body.html
Nájdite :

Kód: Vybrat vše

<!-- BEGIN postrow -->
   <!-- IF postrow.S_FIRST_UNREAD --><a id="unread"></a><!-- ENDIF -->
   <div id="p{postrow.POST_ID}" class="post <!-- IF postrow.S_ROW_COUNT is odd -->bg1<!-- ELSE -->bg2<!-- ENDIF --><!-- IF postrow.S_UNREAD_POST --> unreadpost<!-- ENDIF --><!-- IF postrow.S_POST_REPORTED --> reported<!-- ENDIF --><!-- IF postrow.S_ONLINE --> online<!-- ENDIF -->">
Tu nájdite a zmažte :

Kód: Vybrat vše

<!-- IF postrow.S_ONLINE --> online<!-- ENDIF -->
Nájdite :

Kód: Vybrat vše

<!-- IF postrow.U_POST_AUTHOR --><a href="{postrow.U_POST_AUTHOR}">{postrow.POSTER_AVATAR}</a><!-- ELSE -->{postrow.POSTER_AVATAR}<!-- ENDIF --><br />
Ak chcete online/offline img nad avatarom pred to pridajte :

Kód: Vybrat vše

<!-- IF postrow.ONLINE_IMG -->{postrow.ONLINE_IMG}<!-- ENDIF --><br />
ak online/offline img pod avatarom tak za to pridajte :

Kód: Vybrat vše

<!-- IF postrow.ONLINE_IMG -->{postrow.ONLINE_IMG}<!-- ENDIF --><br />
Teraz si už len nájdite alebo vytvorte 2 obrázky, nahrajte do prosilver/imageset/cs/ a ostatných adresárov podla Vášho jazyka a v ACP - Štýly - Sada obrázkov - Upraviť pridajte k User online icon_user_online.png a nastavte rozmery a takisto nájdite User offline a pridajte icon_user_offline.png aj s rozmermi obrázka

Kamahl
Příspěvky: 1713
Registrován: ned 25. bře 2007 1:00:00
Bydliště: Bratislava
Kontaktovat uživatele:

Re: Úpravy prosilver stylu

Příspěvek od Kamahl » čtv 07. úno 2008 15:08:53

Upozornenie na novu súkromnú správu

Táto úprava zastaví načítavanie štýlu pri prijatí správy a vyhodí okno s možnosťou prečítania novej správy. Ak si ju prečítať nechcete, stlačíte Cancel a stránka sa načíta.

Otvorte : overall_header.html
Nájdite :

Kód: Vybrat vše

if ({S_NEW_PM})
      {
         popup('{UA_POPUP_PM}', 400, 225, '_phpbbprivmsg');
      }
Prepíšte s :

Kód: Vybrat vše

if ({S_NEW_PM})
{
var answer = confirm("Máte novú súkromnú správu. Chcete si ju zobraziť?");
if (answer)
window.location ='{U_PRIVATEMSGS}';
answer = null;
}
Ak chcete aby vám to fungovalo, nezabudnite povoliť pop up po prijatí novej správy v užívateľskom paneli

Kamahl
Příspěvky: 1713
Registrován: ned 25. bře 2007 1:00:00
Bydliště: Bratislava
Kontaktovat uživatele:

Re: Úpravy prosilver stylu

Příspěvek od Kamahl » čtv 07. úno 2008 15:49:52

Profil na ľavej strane
Najprv je treba otočiť obrázok ukazujúci online stav. Tu už je otočený Obrázek
Prípadne si vytvorte svoj vlastný, spravte nejakú bodku alebo upravte pomocou návodu http://www.phpbb.cz/viewtopic.php?f=29&t=12673#p60810

Otvorte : content.css

Nájdite :

Kód: Vybrat vše

.postbody
Zmente float: left na float: right

Nájdite :

Kód: Vybrat vše

.postprofile
Zmente float: right na float: left a border-left na border-right

Nájdite :

Kód: Vybrat vše

.pm .postprofile
Zmente border-left na border-right

Nájdite :

Kód: Vybrat vše

.online
Tam nájdite :

Kód: Vybrat vše

background-image: none;  
background-position: 100% 0;  
background-repeat: no-repeat;  
Prepíšte s :

Kód: Vybrat vše

background-image: none;  
background-position: 0 0;  
background-repeat: no-repeat;  
Nájdite :

Kód: Vybrat vše

.postbody
Za to pridajte :

Kód: Vybrat vše

padding-left: 10px;  
border-left: 1px solid #FFFFFF;
Nájdite :

Kód: Vybrat vše

.postprofile
Zmažte border-right

Premenujte .pm .postprofile na .pm .postbody a zmente border-right na border-left

Kamahl
Příspěvky: 1713
Registrován: ned 25. bře 2007 1:00:00
Bydliště: Bratislava
Kontaktovat uživatele:

Re: Úpravy prosilver stylu

Příspěvek od Kamahl » čtv 07. úno 2008 17:15:46

Menu z tabov

Upozorňujem, že riešenie pomocou IF basename(... nie je správne v templatových súboroch, avšak funguje.

Náhľad
Obrázek

Otvorte: styles/prosilver/template/overall_header.html
Nájdite:

Kód: Vybrat vše

<div class="navbar">
Pred to pridajte :

Kód: Vybrat vše

<div id="tabs">
       <ul>
          <li<!-- IF basename($_SERVER['SCRIPT_NAME']) == 'index.php' or basename($_SERVER['SCRIPT_NAME']) == 'viewforum.php' or basename($_SERVER['SCRIPT_NAME']) == 'viewtopic.php' --> class="activetab"<!-- ENDIF -->><a href="{U_INDEX}"><span>{L_INDEX}</span></a></li>
          <!-- IF S_DISPLAY_SEARCH --><li<!-- IF basename($_SERVER['SCRIPT_NAME']) == 'search.php' --> class="activetab"<!-- ENDIF -->><a href="{U_SEARCH}" title="{L_SEARCH_ADV_EXPLAIN}"><span>{L_SEARCH}</span></a></li><!-- ENDIF -->
          <!-- IF S_DISPLAY_MEMBERLIST --><li<!-- IF basename($_SERVER['SCRIPT_NAME']) == 'memberlist.php' --> class="activetab"<!-- ENDIF -->><a href="{U_MEMBERLIST}" title="{L_MEMBERLIST_EXPLAIN}"><span>{L_MEMBERLIST}</span></a></li><!-- ENDIF -->
          <li<!-- IF basename($_SERVER['SCRIPT_NAME']) == 'faq.php' --> class="activetab"<!-- ENDIF -->><a href="{U_FAQ}" title="{L_FAQ_EXPLAIN}"><span>{L_FAQ}</span></a></li>
       </ul>
    </div>
Môžete si to už ďalej upravovať podla svojich predstáv
Naposledy upravil(a) Kamahl dne pát 08. srp 2008 12:46:02, celkem upraveno 1 x.

Kamahl
Příspěvky: 1713
Registrován: ned 25. bře 2007 1:00:00
Bydliště: Bratislava
Kontaktovat uživatele:

Re: Úpravy prosilver stylu

Příspěvek od Kamahl » pát 08. úno 2008 18:26:47

Pridanie obrázku do pozadia textarey pri písaní príspevkov

Ovorte : prosilver/styles/theme/forms.css
Nájdite :

Kód: Vybrat vše

textarea {
   font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
   width: 60%;
   padding: 2px;
   font-size: 1em;
   line-height: 1.4em;
Tam nájdite :

Kód: Vybrat vše

font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
Pred to pridajte :

Kód: Vybrat vše

background-image: url('./images/textarea_bg.gif');
      background-repeat:no-repeat;
      background-position:center;
Teraz uploadnite obrázok textarea_bg.gif do priečinku styles/prosilver/theme/images a bude sa zobrazovať pri písaní príspevku aj súkromnej správy.

ameeck
Příspěvky: 6425
Registrován: ned 06. lis 2005 1:00:00

Re: Úpravy prosilver stylu

Příspěvek od ameeck » ned 17. úno 2008 23:48:01

Téma pro podporu a řešení problému ohledně těchto postupů naleznete zde:
http://www.phpbb.cz/viewtopic.php?f=51&t=12767

Kamahl
Příspěvky: 1713
Registrován: ned 25. bře 2007 1:00:00
Bydliště: Bratislava
Kontaktovat uživatele:

Fix png obrazkov v IE

Příspěvek od Kamahl » sob 01. bře 2008 1:41:29

Otvorte styles/vas_styl/template/overall_header.html :

Nájdite:

Kód: Vybrat vše

</head>
Pred to pridajte :

Kód: Vybrat vše

<!--[if lt IE 7.]>
<script defer="defer" type="text/javascript" src="fixpng.js"></script>
<![endif]-->
Stiahnite tento súbor a uploadnite do zložky styles/vas_styl/template/. Keďže mi sem nejde pridať súbor, dávam odkaz na topic z fóra na ktoré som dával tento návod tiež. Prosím kompetentných o upnutie súboru sem na fórum :)
Přílohy
fixpng.rar
(660 bajtů) Staženo 562 x
Naposledy upravil(a) WhiteWolfSix dne sob 07. úno 2009 12:33:39, celkem upraveno 1 x.
Důvod: tag </head> vložený do code, uploadnutý súbor fixpng.rar

Kamahl
Příspěvky: 1713
Registrován: ned 25. bře 2007 1:00:00
Bydliště: Bratislava
Kontaktovat uživatele:

Reklamný box za prvým príspevkom

Příspěvek od Kamahl » sob 01. bře 2008 1:48:05

Táto úprava vám za každý prvý príspevok v každej téme pridá "box" v ktorom sa zobrazí vaša reklama

Otvorte : styles/prosilver/template/viewtopic_body.html
Nájdite okolo riadku 224:

Kód: Vybrat vše

<span class="corners-bottom"><span></span></span></div>
	</div>

	<hr class="divider" />
Za to pridajte :

Kód: Vybrat vše

<!-- IF postrow.S_FIRST_ROW --><!-- INCLUDE ad_banner.html --><!-- ENDIF -->
Vytvorte nový súbor ad_banner.html do zložky styles/prosilver/template/

Do ad_banner.html vložte :

Kód: Vybrat vše

	<div id="google{postrow.POST_ID}" class="post bg1">
		<div class="inner"><span class="corners-top"><span></span></span>


<div id="ads">
    <div class="content">
    Kód vašej reklamy, google adsense script alebo niečo iné
    </div>
</div>

		<span class="corners-bottom"><span></span></span></div>
	</div>

	<hr class="divider" />

Kamahl
Příspěvky: 1713
Registrován: ned 25. bře 2007 1:00:00
Bydliště: Bratislava
Kontaktovat uživatele:

Skrytý imageshack upload bar

Příspěvek od Kamahl » sob 01. bře 2008 1:56:34

Tento mod pridá link pod textareu v posting.php. Po kliknutí naň sa imageshack upload bar zobrazí a môžete si uploadnúť obrázok.


Úprava je dostupná v tomto MODu:
http://www.phpbb.cz/viewtopic.php?f=64&t=13731

Odpovědět