Image Float / Font / Read More Questions

Posted in: Newsmag
Post count: 95

Hello. I have a few problems with images, font and readmore added manually.

Buna ziua. Am instalat in test tema si am niste probleme; momentan nu pot pune tema pe site live, datorita punctelor de mai jos.

1. am poze de 300×200 (thumbs) si imi arata una sub alta in site-ul principal. am gasit o rezolvare pe forum, dar e din 2014, nu mi se aplica, am incercat. (https://forum.tagdiv.com/topic/how-to-put-images-in-same-raw-in-4-0-2/)

Am aplicat aceste coduri:

.td-post-content img, .mce-content-body img {
float: left; margin: 5px 5px 5px 0px;
padding: 2px;
}

.td-post-content p, .mce-content-body p, .comment-content p {
clear: both;
margin: 5px 5px 5px 0px;
}

.cmam-content-widget.widget, .cmampos1-content-widget {
padding: 2px 5px 0px 0px;
}
(acesta al treilea, e de la clickmissile plugin, il folosesc, caci daca folosesc ads de la dvs din tema, nicicum nu imi iese, din aceeasi problema. am nevoie de float. sa mearga, si la ads nu exista float. ori mi se mareste catpostul, fara sens, ori stanga, dreapta, dar eu vreau dedesubt, gen float, liber, iar ce continut am sa nu se duca, stanga, dreapta; de accea folosesc click missile de la heatmaptheme.)

– sa revin. am pus codurile si imi arata cat de cat normal pozele si textul, fara spatii imense. am poze mici, in general de 300px. Sunt corecte codurile ? Le pun direct in script.css, jos de tot, pentru a se incarca direct pe site.

2. pozele imi arata una sub alta si in tinymce, cand creez posturi! am pus tema default, imi arata normal, unele langa altele formatare corecta, text corect, deci e problema tema. cum sa rezolv pentru atunci cand creez posturi sa imi arate normal, cand dau pe VISUAL ?

3. daca punctul unu ar avea codul corect, nu as avea aceasta problema din punctul 3.

siteul meu are continutul postului astfel: titlu in strong cu h3, apoi thumb image de 300 si “manual” adaugat “readmore” apoi continut in continuare. homepageul eu il setez cu 10 LAST POSTS, caci neavand featured images, folosesc ceea ce am explicat.

Am setat M15 in “Blog and Posts template” – singurul care mi sa-ar potrivi…? as dori oarecum fixat, gen ca in imagini.

dar iata problema. un post vine peste altul… ca in screenshot. am scos codurile adaugate de mine si vad ca .td-post-content img, .mce-content-body img ar fi de vina. nu este corect codul.

4. as dori sa pun CONTINUE de pe mijloc in stanga, normal (precum READMORE este in alte blocuri), care este codul?

5. template settings – search template: SEARCH as dori sa fie tot gen homepage) setez tot M15. este de editat un cod si acolo, sa nu imi vina un post peste altul ? daca da, va rog dati-l.

6. categoriile : le doresc normal, ca si latest posts, adica textul meu cu readmore adaugat manual, in M15. sper ca sa nu fie nevoie de cod. de este, va rog.

7. fontul titlului: folosesc DEFAULT SITE POST TEMPLATE – Style 3 (desi nu am featured image, nu am nevoie, e debifat)

daca ma duc in fonts, style 3 si modific size 35 cand se incarca pagina postului, fontul din mare se face mic, si este deranjant. as dori sa adaug direct in css sa schimb marimea fontului in 35. unde este?

8. as dori sa pun By USER – DATE – VIEWS deasupra la TAGS

Ma intereseaza imaginile una langa alta, caci unele sunt butoni de download mici, ce nu trebuie sa fie mult prea departe de ad si sa fie simetrici cu text si imagini mai sus…

Multumesc pentru rabdare, atat momentan.
Detin si tema newspaper, si in ea este problema cu pozele ce nu merg una langa alta. puteti da si pentru ea? doar codul de fix imagini.

imagebam.com imagebam.com imagebam.com imagebam.com imagebam.com imagebam.com

  • This topic was modified 10 years by cstyn. Reason: image added
Post count: 95

Help, please ?

Post count: 95

Poate incalc regulile forumului si nu intreb in engleza. Am sa fac post pentru fiecare intrebare, poate ma ajuta si membrii. Scuze.

Post count: 6535

Buna

1. Tema nu are nici un widget care sa alinieze imaginile una langa alta asadar vei avea nevoie de o implementare custom. Cel mai siplu mod ar fii sa adugi imaginile in interiorul unui container astfel incat sa le poti targeta cat mai usor cu css. Un exemplu de baza ar fii acesta: http://screencast.com/t/bCCByWbcXhttp://screencast.com/t/yrqmgQmug
O alta optiune ar fii utilizarea unui media grid din Visual Composer: http://screencast.com/t/BkT3swfOYCq0http://screencast.com/t/eDi5Dj3XSy
Revenind la codul tau ar fi de facut cateva observatii:
– daca veri sa modifici layout-ul din imaginilor din post editor, codul aferent trebuie adaugat in editor-style.css: http://screencast.com/t/kQOUXLoIRqFE Css-u; care controleaza layout-ul editorului se afla in acel fisier.
– cnd targetezi imaginila va trebuii sa te legi te o clasa unica pentru pagina, sau pentru containerul in care se afla ele. Utilizant .td-post-content p vei targeta toate imaginile din continutul postului si e posibil sa apara efecte nedorite.
– codul css care se refera la imaginile de pe frond-end poate fi adaugat in style.css: http://screencast.com/t/JMStEQBvL

2. Poti folosii acest css in editor-style.css:

.mce-content-body img{
display: inline-block;
}

3.Doar din imaginile tale nu pot sa imi dau seama care e selectorul gresit. Folosind ins o clasa custom pentru iomaginile din continutul postului, ca in exemplul de mai sus, proprietayea de float se va aplica doar pentru acel container si nu ar trebuii sa mai afecteze layout-ul celorlante imagini.

4 Poti folosi acest css: http://screencast.com/t/svShfuUDd1W

.more-link-wrap{
margin-left: 0;
}

5 POti seta modulul 15 pentru fiecare categorie din theme panel > categories: http://screencast.com/t/hDvhNuwKy2

6. Poti folosi acest css:

.td-post-template-3 header .entry-title {
font-size: 35px;
}

8. Ca sa muti data si views-urile deasupra tag-urilor trebuie sa modifici single_template_3.php, taie (cut) aceste linii: http://screencast.com/t/uvXlZJUl03Xu si insereazale in loop-siongle-3.php, pentru post template 3, si sa muti liniile indcate ca in aceasta imagine: http://screencast.com/t/XggROxpEL

Te rugam sa iei in considerare ca orice modificare adusa in structura posturilui sau in modul de afisare a continutului implica customizari suplimentare. Noi oferim suport pentru tot ce inseamna modul de utilizare si configurarea corecta a temei. Orice customizare care implica modificarea actualei implementatri, pentru orice element implica schimbarea codului actual sau ajustarea lui pentru a abtione rezultatul dorit.
Din pacaqte timpul nu ne permite sa oferim servicii de customizare, fiind un numar mic de membrii ne confruntam cu un volum mare de munca. Pentru orice alte customizari va trebuii fie sa angajezi un developer care sa te ajute in realizarea lor.

Multumim pentru intelegere.

Post count: 95

Este ora 5, astazi nu mai prind suport, voi face un reply in curand.
Codul dvs nu functioneaza, in punctul 2

.mce-content-body img{
display: inline-block;
}

in legatura cu pozele, chiar nu inteleg. Am poze de pe imagebam.com de exemplu, in forum aici arata una langa alta, e o implementare de baza, nu pot folosi tema. Am 35.000 de posturi pe site, si restul vor fi cu poze ce trebuie sa imi functioneze ca orice alta tema.

ca in orice alta tema amarata am nevoie ca atunci cand copii niste poze urcate pe imagebam de exemplu sa imi arate normal, ca mai jos: cum arata aici in acest reply, sau mai sus, una langa alta. nu pot sa cred ca imi cere sa fac implementare custom… containere, etc. nu se poate asa ceva. e ceva de baza, totusi…

imagebam.com imagebam.com

exemplu mai sus…

iar punctul 6 la fel. codul este pus degeaba. realizati ca atunci cand se incarca pagina la dvs intai incarca fontul mare si apoi cel de 35 ?

.td-post-template-3 header .entry-title {
font-size: 35px;
}

Voi continua. Sper sa reusesc sa folosesc tema. Momentan este inutilizabila in cazul meu.

Post count: 95

Am folosit ce ati spus dvs si am editat direct in css, fara sa pun la urma, caci nu prea mergea treaba, linii precum 6629, 4702 5px, 5076 pus 5px si display: inline-block; iar in editor css am editat direct linia 1457 adaugat display: inline-block;. Continue e mutat stanga folosind codul dvs. Nu am ajuns la data si views-urile, dar o sa urmez sfatul dvs. O sa caut si pixelii body si p pentru txt in editor css,sper sa ii gasesc.

Mai totul e display block sa fi fost inline de la inceput si niste px mai putini pentru img si p, si tema merge si pentru cei cu poze mai mici…

Rezolvat. (Daca am gresit ceva, puteti sa ma corectati). Multumesc.

  • This reply was modified 10 years by cstyn.
Post count: 6535

Buna

CSS-ul pentru aliniere imaginilor este corect si ar trebuii sa mearga: http://screencast.com/t/ncQKe1c3Ofthttp://screencast.com/t/NvJxeJkAdx

In cea ce priveste imaginile eu pot sa iti dau un css simplu care le schimba modul de afisare in pagina insa acesta va afecta toate imaginile care le vei aduga ulterior in orice post. Codual ar genera avest rezultat: http://screencast.com/t/EGGEuxLKL

.td-post-content img{
display: inline-block;
margin-left: 10px
}

Dupa cum spuneam toate imaginile inserate in continutul postului vor fi afectate de acest cod si nu pot anticipa cum vor fi afectate pe diferite post template-uri sau pe diferite dispozitive mobile.
Cea mai sigura metoda e cea prezentata in respunsul anterior, desii e un pic mai sofisticata.
Faci un container specific pentru imaginile care vrei sa le afisezi una langa alta, iar apoi foilosesti clasa in css pentru a aplica stilul dorit. In acest fel vei targeta doar imaginile din interiorul acelui container, fara riscul de a afecta alte imagini in mod inutil.
Majoritatea elementelor din continutul postului au disply block, exceptant situatille cand au float. Aceasta implementare se poate schimba relativ usor doar ca trebuie sa fi atent la ce selctori folosesti. Cu cat selectorul e mai precis cu atat riscurile sunt mai mici. De examplu daca vrei sa schimbi disply-ul paragrafelor poti face astfel:

p{
display: inline block;
}

Aceastra nu e cea mai buna abordare fiinca vei prinde o gama foarte mare the paragrafe care sar putea sa nu fie afisate bine folosind acest disply. In schimb poti face astfel:

.post-id-123 .td-post-content p{
display: inline-block;
}

Acest css targeteaza dor p-ul din continutul postului cu id-ul 123. Acesta e doar un exemplu de baza, dar poate fii folosit pentru a face css-ul cat mai specific.
Un alt aspect de care trebuie sa tii cont e complexitatea temei. Css-ul e imens si multe reguli se pot rescrie in functie de situatie. Trebuie sa fii atent ce selctori folosesti, daca sunt suficienti de puternici astfel incat sa rescrie codul initial si mai ales daca acei selctori nu afecteaza si elemnte nedorite.

Multumesc!

Viewing 7 posts - 1 through 7 (of 7 total)
The forum ‘Newsmag’ is closed to new topics and replies.