Resimleri Otomatik Sığdırmak « WordPress Türkiye Forumları

WordPress Türkiye Forumları » Kurulum ve Kullanım

Resimleri Otomatik Sığdırmak

(30 mesaj(lar))

1 yıl önce Hayko tarafından başlatıldı
eren1 tarafından son cevap
Bu konu Destek sorusu değil

Etiketler:

1 2 Sonraki »

Hayko
Üye

bi kaç büyük resim ekledim dün fakat ana sayfada bi kısmı çıktı geri kalan kısmın wp deyim yerindeyse yedi resimlerin boytlarınıda küçültmek zor geldi ve soralım dedik belki eklentisi vardır resimleri otomatik sığdırmak mümkün mü yani bununla ilgili bi eklenti var mı ?

iyi çalışmalar

1 yıl önce #
eylultoprak
Editör

#container img {
padding:5px;
border:1px solid #F8F9DB;
background:white;
max-width: 375px;
width: expression(this.width > 375 ? 375: true);

bunun gibi bir kod ama css'e kendi temana göre yorumlaman lazım.

birde böyle bir şey var

1 yıl önce #
Hayko
Üye

#container img {
padding:5px;
border:1px solid #F8F9DB;
background:white;
max-width: 375px;
width: expression(this.width > 375 ? 375: true);

kodları css de özel bir alanamı eklieceğiz ?

1 yıl önce #
eylultoprak
Editör

özel bir yer değil temandaki css kodlarını bilmediğim için böyle verdim sende nasıldır bilemem... öenmli olan şu üç kod

background:white;
max-width: 375px;
width: expression(this.width > 375 ? 375: true);

1 yıl önce #
auth
Üye

Bu kodlar olmuyor baktım ama..

1 yıl önce #
eylultoprak
Editör

kodlar çalışıyor. yanlış yere yerleştirmişsinizdir.

1 yıl önce #
Hayko
Üye

sen nereye ekledin eylul söyle bizde ona göre ekliyelim

1 yıl önce #
eylultoprak
Editör

storyconten. img diye bir şey mi vardı ne oraya eklemiştim .. css düzenine göre değişiklik gösterir. kendiniz bulmak zorundasınız

Not : eylül değil eylültoprak istirham ediyorum :)

1 yıl önce #
eRay
Üye

p img {
padding: 0;
max-width: 100%;
}

Yeni keşfettim :) .Bu kodu css'de herhangi bir yere koyarsanızda oluyor.

1 yıl önce #
aan
Üye

Verilenler ile denedim olmadı güzel bir açıklama olsa makbule geçer

1 yıl önce #
eylultoprak
Editör

http://wp-plugins.net/plugin/imax-width/#plugin_2085 şöyle bir şey varmış denemedim ben siz bi deneyin isterseniz.

1 yıl önce #
aan
Üye

Eylultoprak tesekkürler denedim sorunsuz çalıştı tavsiye ederim. zengin metin ediştörü kullanarak eklenen resimlerde iş görmediğini hatırlatayım

img tagları kullanarak eklenirse sorunsuz çalışmakta

not: daha eklentiden önce eklenen resimlerde etkili değil yeni eklenenlerde çalışmakta

1 yıl önce #
turkbaron
Üye

şu kodu :

p img {
padding: 0;
max-width: 100%;
}

şununla değiştirince oluyor :

p img {

padding: 0;

max-width: 375px;
width: expression(this.width > 375 ? 375: true);

}

375 değişkendir.bu size bağlı. ayrıca ilk koddaki 100%; oranını küçülterek de bir sonuca varabilirsiniz.

5 ay önce #
turx
Üye

zengin metin ediştörü kullanarak eklenen resimlerde iş görmediğini hatırlatayım

img tagları kullanarak eklenirse sorunsuz çalışmakta

yani tam olarak nasıl eklemeliyiz.çalışır örnek görebileceğimiz bir yer var mı ? 2.5.1 ile uyumlu mu ? çok soru sordum ama :)

4 ay önce #
heytbecom
Editör

kendi sitemdeki kodlar bu şekilde sorunsuz çalışıyor.

img {padding: 0; max-width: 100%;}
a img { border: none;}

taşma sorunu hiç olmadı.

4 ay önce #
edebiyatdergibi
Üye

Şu şekilde olabilir mi peki? Birçok forum sisteminde bu mevcut başta SMF ve VBulletin'de.

Normal bir şekilde resimi ekliyorsunuz boyutu ne olursa olsun. Sistem sizin belirttiğiniz boyut ayarına göre, yayınladığınız sayfada o resmi küçültüyor. Üstte sarı bir bantta. "Bu resim AA X BB px boyutlarına küçültülmüştür. Orjinalini görmek için tıklayınız" yazıyor. İsteyen resmi büyütüyor isteyen o şekilde izliyor. Böyle bir eklenti var mı?

Yoksa yukarıda bunlar mı anlatılıyor :)

4 ay önce #
heytbecom
Editör

edebiyatdergibi

- forumda aratın dediğiniz şekilde yapan script ve wordpress için düzenlenmiş eklentiler mevcut... Aklıma gelen highslide eklentisi güzeldi. lightbox ve türevleride mevcut. yani buradaki konu ile hem bağlantılı hem de değil. ne yapmak istediğinize bağlı...

ne yapmak istediğinize bağlı..

4 ay önce #
edebiyatdergibi
Üye

Teşekkür ediyorum heytbecom. Yapmak istediğim basit aslında. Yazıya eklediğim resmin o şekilde yayınlanmasını sağlamak eğer konuyu yanlış anlamadıysam bununla alakalı. Dediğiniz eklentiyi deneyeceğim. Olursa güzel olur. Olmazsa sağlık olsun. ilginiz için tekrar teşekkürler.

4 ay önce #
eylultoprak
Editör

Ah şu gençler :) Sanki kırk yaşındayım.

Heytbecom'un belirttiği eklentiyi kurun. Sonra highslide.css

Dosyasını şu şekilde değiştirin.. Bu konuda verdiğim kodlar taşmaları engellemek içindir. Ayrıca profilimdeki siteden örneğini bolca görebilirsiniz

.highslide {
/* cursor: url(graphics/zoomin.cur), pointer;*/
outline: none;
}
.highslide img {
#border: 2px solid gray;
cursor: url(http://www.kendisiteadiniz.com/wp-content/plugins/highslide/graphics/zoomin.cur), pointer;
outline: none;
max-width:650px;
width:expression(this.width > 650 ? 650: true);
max-height:auto;
}

.highslide img {
/*#border: 2px solid gray;*/ /*Uncomment to add border around image */
border:none;

}
.highslide:hover img {
#border: 2px solid white;
}

.highslide-image {
#border: 2px solid white;
}
.highslide-image-blur {
}
a.highslide-full-expand {
background: url(http://www.kendisiteadiniz.com/wp-content/plugins/highslide/graphics/fullexpand.gif) no-repeat;
display: block;
margin: 0 10px 10px 0;
width: 34px;
height: 34px;
}
.highslide-caption {
display: none;
height: 35px;
border: 2px solid white;
border-top: none;
font-family: Verdana, Helvetica;
font-size: 10pt;
padding: 5px;
background-color: white;
text-align:center;
font-weight:bold;
}
.highslide-loading {
display: block;
color: white;
font-size: 9px;
font-weight: bold;
text-transform: uppercase;
text-decoration: none;
padding: 3px;
border-top: 1px solid white;
border-bottom: 1px solid white;
background-color: black;

/* padding-left: 22px;*/
background-image: url(http://www.siteadiniz.com/wp-content/plugins/highslide/graphics/loader.gif);
background-repeat: no-repeat;
background-position: 3px 1px;

}
a.highslide-credits,
a.highslide-credits i {
padding: 2px;
color: silver;
text-decoration: none;
font-size: 10px;
}
a.highslide-credits:hover,
a.highslide-credits:hover i {
color: white;
background-color: gray;
}
/*Close Controls. Enable through wordpress options */
.highslide-close {
float: right;
display: inline;
/* position: relative;*/
margin: 0 5px 5px 0;
font-size: 7pt;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
}

/*Next and Previous Links. Enable through wordpress options*/
.highslide-next {
float: left;
display: inline;
/* position: relative;*/
margin: 0 5px;
font-size: 7pt;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
}

.highslide-previous {
float: left;
display: inline;
/* position: relative;*/
margin: 0 5px;
font-size: 7pt;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
}
.highslide-display-block {
display: block;
}
.highslide-display-none {
display: none;
}

4 ay önce #
edebiyatdergibi
Üye

Çok teşekkür ediyorum Eylül (pardon eylultoprak'tı değil mi istirham etmiştiniz bir konuda yanlış hatırlamıyorsam :)

Çok işime yaradım. Eklentiyi kurdum, denedim. %100 başarı.

4 ay önce #
gevv
Üye

Aklıma gelen highslide eklentisi güzeldi.
teşekkürler Abi ben lightbox kullanıyorum acaba highslide eklentisin yaptığı işi yapabilirmi yada düzenleme yapılabilirmi

benim amacım yorum yapanların ekledikleri büyük resimlerin taşmaması için

4 ay önce #
eylultoprak
Editör

Oda olur gevv hangi tema sitende ki mi?

4 ay önce #
gevv
Üye

evet eylultoprak sitemdeki

4 ay önce #
gevv
Üye

unuttun beni eylultoprak :) lightbox kullanmaya devam nasıl uyarlarım bu iş için ?

4 ay önce #
gevv
Üye

eylultoprak lightboxu nasıl düzenlemek gerekir biraz ip ucu verebilirsen ben uğraşayım :)

3 ay önce #