"Space" između slika u "custom HTML" modulu

Autor Superman, 04. Rujan 2013, 02:16

0 Članovi i 6 Gosti pregledava ovu temu.

Superman

Pozdrav ekipa,

Imam Joomlu 2.5.4 i došao sam do jednog problema i ne znam gdje i kako početi.

Znači u staroj verziji stranice (koje je trenutno još u pogonu, a to je Joomla 1.5) sam većinom radio u "Custom HTML" modulima jer mi je tamo najlakše napraviti ono što želim, pa sam tako tamo i spajao slike (bez razmaka).

Što to znači? To znači da je slika bila "priljepljena" uz drugu sliku, nije bilo niti jedno px protora, pa tako sam iz nekoliko sličica, odnosno nekoliko sličica je tvorilo veliku sliku, a opet, sve te male sličice su mogle biti odvojeni link, pa kada se stisnulo na bilo koju od njih, išlo bi se na odvojene teme, slike, downloads, itd.

E sada, ja kada spajam te slike u novoj stranici (na kojoj trenutno radim i koju ću zamijeniti starom kada bude spremna), to ne mogu napraviti. UVIJEK i između svake slike mi je negdje 5px prostora, pa sam probao i unutar same HTML opcije u editoru, no ništa nije pomoglo.

Čak i unutar editora nema space-a, ali kada se ode na stranicu, vidi se space (taj prostor).

Znali netko gdje se to nalazi unutar .php file-ova, kako bi to makuo?
Ima li netko riješenje kako da napravim da mi unutar "custom HTML" modula ne radi te prostore?

Evo staviti ću i slike kako bi Vam bilo jasnije.
Na "SLIKA 1" je rad unutar editora, gdje stavljam slike i gdje sve izgleda OK, a na "SLIKA 2" je crop sa stranice da vidite kako to izgleda na stranci.

PUNO HVALA svakome na pomoći, pa makar i na pokušaju :D

Dario

Ajd daj nam link do nekog demoa ili nešto da se može pogledati...

Ovako na pamet bi mogao biti problem
1. u CSS-u da je negdje postavljena margina ili padding
2. a tag (link) ti nema display: block u css-u što zna raditi upravo ovakve probleme i kad pregledavaš firebug-om taj a element/tag vidjet ćeš da ti onaj prlavi overlay neide prek cijele slike
3. Možda ti editor (kad) spremaš radi razmake ili prebacuje u novi red - novi red isto zna napraviti razmak....
---
Molim da mi ne šaljete privatne poruke sa zahtjevima za pomoć, takve poruke ignoriram - zato služi forum :)
2b || !2b; this.question();
http://www.dblaze.eu

Superman

#2
Uspio sam.
Nakon 4 sata mijenjajanja svega u .css filovima, otišao sam u modul, kliknuo na sliku i onda je stavio "aligment" na "top". Onda se je donja slika zaljepila za gornju i to je to. :)

Superman

Ne, ipak to nije riješenje, već u drugom redu ista stvar, a onda ni "top" ne pomaže.
Probo sam u svojoj staroj stranici i tamo je sve OK, radi kao sat. Znači slike se spajaju jedna na drugu (u drugu).

Ne kužim...  ::)

wooer

Citat: DarioORION] link=topic=4442.msg15350#msg15350 date=1378284597]
Ajd daj nam link do nekog demoa ili nešto da se može pogledati...
UNIX is basically a simple operating system, but you have to be a genius to understand the simplicity
Documentation & Translation Team Member

Dario

Citat: wooer  u 05. Rujan 2013, 09:44
Citat: DarioORION] link=topic=4442.msg15350#msg15350 date=1378284597]
Ajd daj nam link do nekog demoa ili nešto da se može pogledati...

Kaj nemaš čarobnu kuglu ?
P.S. sorry na spamu, šaljem si opomenu  :nevin:
---
Molim da mi ne šaljete privatne poruke sa zahtjevima za pomoć, takve poruke ignoriram - zato služi forum :)
2b || !2b; this.question();
http://www.dblaze.eu

Superman

#6
Bio sam stavio link, ali sam ga onda maknuo jer sam mislio da sam uspio riješiti problem...  ;D

Evo ponovo: http://www.anubisoprema.com (problem je na dnu stranice)

Hvala na pomoći ;)

bruno-d

#7
Prema tvojim priloženim slikicama koristis zadni Editor - TinyMCE
U njegovim postavkama postavljeno je <p> tagovi po opcijom New Lines

Napravi sljedece
U ADMINISTRACIJI

1.Odi u plugin
2.Potraži  Editor - TinyMCE
3.Otvori
4.Pod postavkama pronađi New Lines i označi BR Elements
5.Spremi postavke

npr.
sada uređuješ članak
kad stisneš ENTER ( path će ostati prazan)
kad stisneš SHIFT + ENTER tada ce sve prazne linije ponovo biti u <p> tagu

U tvom slučaju pošto stavljaš slikice nemoj stiskati SHIFT+ENTER

Meni radi..

Inaće kad ti to dasadi možeš si iinstalirati JCE ili neki drugi editor, bit ces zadovoljniji.
PSD -> Joomla

Superman

To sam probao prvo. Nije to. Mislim da je negdje do .css-a i to čini mi se da je naziv toga #gkwrap3, ali nisam siguran.
Nisam to mogao pronaći.

U TinyMCE sam sve izmjenjap i ništa. Čak sam i unutar editora pod HTML koristio  razne kodove ali ni to nije pomoglo :(

bruno-d

#9
Mislim da sve kod tebe radi ispravno. I editor i template se ponasaju ok.
Ako vec zelis slicice umetati i maknuti razmake izmedu <img> </img>


primjer

<p>
<img src="/images/bottom_top.png">
<img src="/images/bottom_top.png">
<img src="/images/bottom_top.png">
</p>


Bilo bi najlakse dodati novu klasu ovom castom modulu.
U modulu (desno) Advance Options -> modul Class Suffix  -> dodaj -moja-p-klasa


U template css dodaj

.custom-moja-p-klasa img {
    display: block;
}

ili

.custom-moja-p-klasa img {
    line-height: 0!important;
} /* makar se neki nece sloziti sa time */

S obzirom da je responsive template.
Ne preporučam ti ovaj način sa slikicama.

Možeš koristiti clase od bootstrap-a koje su ti vec unutra.
Napravit ces pravu tablicu + responsive
Također možeš umetati slikice između <td></td> ...

http://getbootstrap.com/2.3.2/base-css.html#tables
PSD -> Joomla

Superman

Maknuo sam <p> </p> između kodova i sve isto. Za raditi tablice mi je malo prekomplicirano, jer često baratam slikama i slažem ih u jednu zajednicu na koje stavim link:

Primjer

U staroj verziji Joomle, kao i u staroj verziji ovog template-a je sve OK, ali sa novom verzijom to više ne šljaka.
Problem je što ne znam što je to uopće. Da znam, lakše bi mi bilo pronaći.

Tražiti ću dalje dok to ne probam pronaći i izmjeniti, jer, ponavljam, zbog toga što često ove module, odnosno "custom HTML" modul koristim za personalizaciju i drukčiji izgled template-a.

Hvala PUNO na pomoći, ali tražim dalje... Moram to riješiti... ;)

bruno-d

#11
štima.. :pivo:

Progluglaj i ovo. Text Filterin Settings Joomla
Ako sredis u Jooml 2x - podjeli ovdje.
Pozdrav
PSD -> Joomla

Superman

Citat: bruno-d  u 05. Rujan 2013, 23:09


U template css dodaj

.custom-moja-p-klasa img {
    display: block;
}


Ovo probam dodati u .css, pošto mi je već u modul class suffixu opcija _clear koja već ima svoje značenje unutar teme, negdje sam u css-u vidio to, pa probam dodati tvoj kod ispod.

bruno-d

#13
u modulu dodaj
-moja-p-klasa

u template css
exstenision-> template manager ->templates -> tvoj template
na desno imas vise css stilova..
otvori npr. template.css i stavi ovo nutra

.custom-moja-p-klasa img {
    display: block;
}

PSD -> Joomla

Superman

Odlično, to funkcionira, ali sada sam došao do drugog problema.

Znači u class suffix sam stavio _img, a u override.css (iako sam probao i sa template.css i isto radi) sljedeći kod:

custom_img img {
    display: block;
}

Znači funkcionira, ali sada slike koje su desno, automatski stavlja u novi red, umjesto da je desno gdje sam je i stavio.
Znači slažem nešto kao što sam složio i na staroj stranici:

I----------------------------------------------------------I
I ... velika slika gornja ...
I----------------------------------------------------------I
I ... manja 1 .... I ... manja 2 ... I .... manja 3.... I
I----------------------------------------------------------I
I ... manja 4 .... I ... manja 5 ... I .... manja 6.... I
I----------------------------------------------------------I
I ... velika slika donja
I----------------------------------------------------------I

Kažem, na starnici koju sam stavio u primjeru, sve lijepo radi, mogu raditi što god mi padne na pamet sa slikama, dok ovdje to sada ne mogu, jer spajanje postaje problem...

Imaš možda neku drugu ideju... btw. ovo je bilo odlično, već sam ti htio poslati pivo poštom... ;)