[Wordpress] Uitlijning probleem

[Ronnyrr]

Hallo allemaal,

Ik ben bezig met het aanmaken van een eigen blog.
Het wil tot mijn verbazing in 1 keer aardig lukken echter zit ik met het volgende probleem:
Ik wil alle plaatjes/video's etc links uitlijnen en alle teksten rechts.
In het voorbeeld hier onder wil dat niet lukken. Ik heb al een aantal dingen geprobeerd met float's maar dat mocht niet baten.



Ik dacht er zelf aan dat er via PHP misschien een optie is om alle images/iframe (voor video vanaf youtube) etc. een ID mee te geven. Heb hierop gegoogled maar kon niet nuttigs vinden.

Misschien google ik verkeerd of denk ik helemaal een verkeerde richting op daarom wou ik hier graag om hulp vragen.
Iemand een idee waar ik op moet zoeken bij google om mij een beetje de goeie richting in te duwen zodat ik zelf weer wat kan proberen, of heeft iemand een andere oplossing?

Ik hoor het graag, bij voorbaat dank!

[_Thanatos_]

Je zou es kunnen beginnen met Firebug.

[RobIII]

_Thanatos_ schreef op donderdag 24 november 2011 @ 22:24:
Je zou es kunnen beginnen met Firebug.

Of IE F12 Dev.tools / Chrome Dev.tools / Safari Dev.tools / Opera Dragonfly
Zonder relevante stukken code is het lastig hier iets zinnigs op te zeggen dus begin eens met het posten van de HTML waar 't om draait...

[Ronnyrr]

Heb dat probleem inmiddels opgelost, was een fout met wat hieghts en floats in de css.
Echter zit ik nu met een nieuw probleem.

Ik wil graag de titel van de post rechts naast de video uitlijnen (zie afbeeldingen). Dat krijg ik ook niet voor mekaar, ik krijg de titel nu alleen volledig rechts uitgelijnt met float:right; als ik float:left; gebruikt bokst die de video naar rechts en komt de titel helemaal links. Ook met een aantal margin's krijg ik dit niet opgelost? Kan iemand mij hier misschien nog verder mee helpen?





Normaal zou ik het wel kunnen oplossen met standaard HTML en CSS door de titel na de afbeelding/video te posten op deze manier:

code:

<img src="plaatje.png" />
<h2>Heading</h2>
<p>Loremmetje....</p>

Echter door mijn opmaak dmv Wordpress wil die volgorde niet lukken want mijn volgorde is alsvolgt:

PHP:

        <div id="entry">
        <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
            <div class="post">
                <h2><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h2>
                <?php the_content(); ?>
                    <p class="post_metadata"><strong>Datum:</strong> <?php the_time('j F Y'); ?>&nbsp;&nbsp;&nbsp;
                    <strong>Categorie&euml;n:</strong> <?php the_category(', '); ?>&nbsp;&nbsp;&nbsp;
                    <strong>Comments:</strong> <?php comments_popup_link('0 comments', '1 comment', '% comments'); ?></p>
                    <?php the_tags('<strong>Tags:</strong> ', ', '); ?></p>
            </div>
        <?php endwhile; endif ?>
        </div>

in the_content staan zowel de tekst als de plaatjes en daarboven staat de titel, daarom krijg ik dat niet voor elkaar..
Iemand die mij hiermee verder zou kunnen helpen?
Ik hoop dat ik zo genoeg informatie gegeven heb, mocht er nog meer informatie nodig zijn hoor ik dat graag.

[ Voor 3% gewijzigd door Ronnyrr op 24-11-2011 23:18 ]

[Mastermind]

Zoiets in de css toevoegen:

Cascading Stylesheet:

.post a
{
    display: block;
    float: left;
   clear: both;
}

[Ronnyrr]

Werkt helaas ook niet, heeft hetzelfde effect als

[Tracking Cookie]

Werk je ook met positionering? Als ik dat zo zie moet de titel div de tekst overlappen. Probeer position: absolute; eens voor de titel-div gebruiken.

Meer info: http://w3schools.com/css/css_positioning.asp

[koendenb]

Tracking Cookie schreef op zondag 27 november 2011 @ 22:29:
Werk je ook met positionering? Als ik dat zo zie moet de titel div de tekst overlappen. Probeer position: absolute; eens voor de titel-div gebruiken.

Meer info: http://w3schools.com/css/css_positioning.asp

Nee juist niet, anders gaat de titel door de tekst heen. Je moet het gewoon met floats oplossen zoals hierboven wordt verteld.

[OkkE]

Als ik even snel zoek blijkt dat er genoeg tutorials zijn voor het maken van een "custom post template" in Wordpress. Dat is wat je wil, het "probleem" is de volgorde van je HTML, dat moet je niet proberen op te lossen met CSS.

[matti93]

zoek ook eens op featured images, die kan je relatief eenvoudig zelf in je template op de goede plek zetten (boven de titel).
Als je met externe video's (youtube ed) werkt zijn custom fields misschien een optie om de url in te zetten, dan maak je zelf een iframe ofzoiets op de goede plek.

[KeRsTmAnNeKe]

Kan je dit niet gewoon standaard met wp doen, plaatje invoegen via de editor en dan links uitlijnen? Zorgen dat de tekst daaronder staat waardoor deze links komt te staan?