Phpbb'de slide view yapmak mümkünmü?

phpBB 3.0.x sürümleri için uygun olan hazır ya da küçük kod parçalarını bu forumda paylaşabilirsiniz.
Forum kuralları
- Yeni bir başlık açarken lütfen konu başlığına "Acil yardım", "Acele yardım" tarzlarında içerisinde "yardım" kelimesi geçen cümleler yazmayınız. Bu tip başlıklara kesinlikle cevap verilmeyecektir. Lütfen konu başlığına içeriği en iyi özetleyen anlaşılabilir bir cümle yazınız.

- Ayrıca yeni başlıklarınızı kesinlikle ilgili forumlara açınız. Örneğin, phpBB3 kurulum ve çalıştırması hakkında bir sorununuz varsa "3.0.x Destek Forumu" forumuna başlık açınız; phpBB3 temasından kaynaklı bir sorunuz varsa "3.0.x Stil/Tema Geliştirme & Tartışma & Yardım" forumuna başlık açınız; phpBB3 mod/eklentileriyle ilgili sorununuz varsa "3.0.x MOD Destek" forumuna başlık açınız. Bu kurala uymayan kullanıcıların başlıkları silinebilir ve kullanıcı uyarı alabilir ya da süresiz uzaklaştırılabilir.

- Site kurallarımızı okumadan kesinlikle forumlarımıza herhangi bir katılım yapmayınız.
Kullanıcı avatarı
SysL
Kayıtlı Kullanıcı
Mesajlar: 87
Kayıt: 25.04.2010, 17:37

Re: Phpbb'de slide view yapmak mümkünmü?

Mesaj gönderen SysL »

ramco29 yazdı:Ekteki silde şovu phpbb'ye göre uyarladım, işinizi görebilir..
Ön izleme
Teşekkürler ama bu kendi kendine slayt yapıyor.pek işime yarayacak türde değil.
Kullanıcı avatarı
SysL
Kayıtlı Kullanıcı
Mesajlar: 87
Kayıt: 25.04.2010, 17:37

Re: Phpbb'de slide view yapmak mümkünmü?

Mesaj gönderen SysL »

Güzel bir tane daha buldum eğer ilgilenmek isteyen varsa tüm bilgilerini buraya ekliyorum.

Slider Demo



Step 1: HTML page:

Create a new HTML page and copy and paste the following code inside <body> tag:

Kod: Tümünü seç

<div id="header">
<div class="wrap">
<div id="slide-holder">
<div id="slide-runner">
<a href=""><img id="slide-img-1" src="images/nature-photo.png" class="slide" alt="" /></a>
<a href=""><img id="slide-img-2" src="images/nature-photo1.png" class="slide" alt="" /></a>
<a href=""><img id="slide-img-3" src="images/nature-photo2.png" class="slide" alt="" /></a>
<a href=""><img id="slide-img-4" src="images/nature-photo3.png" class="slide" alt="" /></a>
<a href=""><img id="slide-img-5" src="images/nature-photo4.png" class="slide" alt="" /></a>
<a href=""><img id="slide-img-6" src="images/nature-photo4.png" class="slide" alt="" /></a>
<a href=""><img id="slide-img-7" src="images/nature-photo6.png" class="slide" alt="" /></a>
<div id="slide-controls">
<p id="slide-client" class="text"><strong>post: </strong><span></span></p>
<p id="slide-desc" class="text"></p>
<p id="slide-nav"></p>
</div>
</div>
</div>
</div>
</div>


Step 2: CSS file

Kod: Tümünü seç

*{
margin:0;
padding:0;
}
html{
height:100%;
}
body{
height:100%;
color:#a4a4a4;
cursor:default;
font-size:11px;
line-height:16px;
text-align:center;
background-color:#000;
background-position:50% 0;
background-repeat:no-repeat;
font-family:Tahoma,sans-serif;
}
a:link,a:visited{
color:#fff;
text-decoration:none;
}
a img{
border:0;
}
div.wrap{
width:993px;
margin:0 auto;
text-align:left;
}
div#top div#nav{
float:left;
clear:both;
width:993px;
height:52px;
margin:22px 0 0;
background:url url(images/nav-bg.png) 0 0 no-repeat;
}
div#top div#nav ul{
float:left;
width:700px;
height:52px;
list-style-type:none;
}
div#nav ul li{
float:left;
height:52px;
}
div#nav ul li a{
border:0;
height:52px;
display:block;
line-height:52px;
text-indent:-9999px;
}
div#header{
margin:-1px 0 0;
}
div#video-header{
height:683px;
margin:-1px 0 0;
}
div#header div.wrap{
height:299px;
background:url(images/header-bg.png) 50% 0 no-repeat;
}
div#header div#slide-holder{
z-index:40;
width:993px;
height:299px;
position:absolute;
}
div#header div#slide-holder div#slide-runner{
top:9px;
left:9px;
width:973px;
height:278px;
overflow:hidden;
position:absolute;
}
div#header div#slide-holder img{
margin:0;
display:none;
position:absolute;
}
div#header div#slide-holder div#slide-controls{
left:0;
bottom:228px;
width:973px;
height:46px;
display:none;
position:absolute;
background:url(images/slide-bg.png) 0 0;
}
div#header div#slide-holder div#slide-controls p.text{
float:left;
color:#fff;
display:inline;
font-size:10px;
line-height:16px;
margin:15px 0 0 20px;
text-transform:uppercase;
}
div#header div#slide-holder div#slide-controls p#slide-nav{
float:right;
height:24px;
display:inline;
margin:11px 15px 0 0;
}
div#header div#slide-holder div#slide-controls p#slide-nav a{
float:left;
width:24px;
height:24px;
display:inline;
font-size:11px;
margin:0 5px 0 0;
line-height:24px;
font-weight:bold;
text-align:center;
text-decoration:none;
background-position:0 0;
background-repeat:no-repeat;
}
div#header div#slide-holder div#slide-controls p#slide-nav a.on{
background-position:0 -24px;
}
div#header div#slide-holder div#slide-controls p#slide-nav a{background-image:url(images/silde-nav.png);}
div#nav ul li a{background:url(images/nav.png) no-repeat;}

Step 3: simple JavaScript for jQuery sliders:

copy and paste the following code for jQuery sliders.add to jQuery sliders code after your HTML code in BODY section. you can change the post title and description easily just change "client" command and for description just change "desc" from Jquery code.

Kod: Tümünü seç

<script type=" text="" javascript="">
if(!window.slider) var slider={};slider.data=[{"id":"slide-img-1","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-2","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-3","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-4","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-5","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-6","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-7","client":"nature beauty","desc":"add your description here"}];
</script>


Step 4: link jquery.js, scripts.js, file to your html pages :

Download the jquery.js, scripts.js, file and link this file in your HTML page inside <head> tag. Replace the "[" and "] " with "<" and ">".

Kod: Tümünü seç

[script type="text/javascript"] var _siteRoot='index.html',_root='index.html';
[/script]
jquery.js
scripts.js 

Save and test the result!
Dosya ekleri
example.rar
Örnek
(1.31 MiB) 252 kere indirildi
Kullanıcı avatarı
SysL
Kayıtlı Kullanıcı
Mesajlar: 87
Kayıt: 25.04.2010, 17:37

Re: Phpbb'de slide view yapmak mümkünmü?

Mesaj gönderen SysL »

Yaw şu olayı phpbb'ye bir aktaramadık gitti,olsa çok güzel olurdu.Gördükçe foruma girip bu başlığı açıyorum :roll: Bu ekli olan slider'lardan çok daha iyi ve güzel olanları var ama eklesem neye yarar foruma eklenemedikten sonra :mrgreen: Neyse konu up up..belki kısmetlisi çıkar..
Revolte
Kayıtlı Kullanıcı
Mesajlar: 49
Kayıt: 05.07.2009, 13:19
Konum: form
İletişim:

Re: Phpbb'de slide view yapmak mümkünmü?

Mesaj gönderen Revolte »

Arkadaşlar
Çeşitli sitelerden aktardığınız konular bir hayli kafa karıştırıcı. Üstüne üstlük bu kafa karışıklığını giderecek bu konuya son verecek bu konularda deneyim sahibi bir arkadaş da el atmış değil. Konu sürünceme de kalmış.

Area 51 Sitesinde BBCode Nivo Slider BBCode v.0.0.2 geliştirmişler.

''kopya
root / styles / prosilver / template / jquery.nivo.slider.pack.js> styles / prosilver / template / jquery.nivo.slider.pack.js
/ root / styles / prosilver / tema / nivo_slider / *. *> stilleri prosilver / tema / nivo_slider / *. * açık styles / prosilver / template / overall_header.html bulabilirsiniz''
demişler

burası bana karışık geldi / *. *> bu işaret ne demek???

Tam çözemeyince de eksik yaptım hata verdi.

Bu olayı tam anlatacak biri yok mu?

[BBCode] Nivo Slider BBCode v . 0.0.2 yapan arkadaşalar lütfen kendisine saklamasınlar burada deneyimlerini paylaşırlarsa sevinirim. Yoksa PhpBB yi terk edip Drupala geçeceğim zira bu konuda yeterli kaynak söz konusu. O kadar tecrübem boşa gidecek.Umarım öyle olmaz :roll:

Link Bu: http://www.4seven.de/forum/6test/viewto ... ?f=7&t=113
bu adreste BBCode ve mod'unun kurulumu anlatılıyor.
İlgilenen arkadaşalara...
Revolte
Kayıtlı Kullanıcı
Mesajlar: 49
Kayıt: 05.07.2009, 13:19
Konum: form
İletişim:

Re: Phpbb'de slide view yapmak mümkünmü?

Mesaj gönderen Revolte »

(Mod un nasıl kurulacağını sormuyorum bu konuda forumda yeterli dökuman var)

Yukarıda adresini link olarak verdiğim anlatımda Mod kurulurken yapılmasını istenilen kopileme sıralamasında bazı işaretler söz konusu bunlar ne anlama geliyor?

Yani bu işaretler: *.* >
Bunların bir anlamı var mı yoksa sıra takip etmek için konulmuş bir yön göstergesi mi?

Tam cümleyi vereyim belki daha iyi anlaşılır:
copy

root/styles/prosilver/template/jquery.nivo.slider.pack.js > styles/prosilver/template/jquery.nivo.slider.pack.js
root/styles/prosilver/theme/nivo_slider/*.* > styles/prosilver/theme/nivo_slider/*.*
Yardım edebilecek, ilgilenebilecek kimse yok mu?
Revolte
Kayıtlı Kullanıcı
Mesajlar: 49
Kayıt: 05.07.2009, 13:19
Konum: form
İletişim:

Re: Phpbb'de slide view yapmak mümkünmü?

Mesaj gönderen Revolte »

Yukarıda bir soru sormuştum aradan kaç ay ve kaç zaman geçti herkes Fransız takılmaya devam ediyor
:-(
air

Re: Phpbb'de slide view yapmak mümkünmü?

Mesaj gönderen air »

Kod: Tümünü seç

root/styles/prosilver/theme/nivo_slider/*.* > styles/prosilver/theme/nivo_slider/*.*
yukarıdaki ifadenin anlamı:
elinizdeki nivo_slider klasörü içindeki tüm dosyalar, serverinizde yine aynı adlı klasörün içine atılacak. serverinizde aynı adlı klasörünüz muhtemelen yoktur. dolayısıyla klasör olduğu gibi içindekilerle birlikte temanızın theme adlı klasörü içine atılacak. (root/styles/prosilver/theme/nivo_slider).
Kilitli

“3.0.x Kod Parçaları” sayfasına dön

Kimler çevrimiçi

Bu forumu görüntüleyen kullanıcılar: Hiç bir kayıtlı kullanıcı yok ve 3 misafir