Support

Account

Home Forums Front-end Issues How to call wysiwg fields and place and style them properly?

Solved

How to call wysiwg fields and place and style them properly?

    • rpk

    • February 13, 2014 at 2:06 am

    I build a custom post type for news/blog posts. beneath is the html/php snippet for a single post view. one of the used fields is a wysiwg field (news-post).

    <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
    	<section>
    			<h2 class="mus-hi slogan-head fancy"><span><?php the_time( 'j. F Y' ); ?></span></h2>
    			<p class="bran-hn slogan-state packed"><?php the_title(); ?></p>
    	</section>	
    	<?php $blogpostimage = get_field('news_image'); ?>
    	<span class="picture" data-picture data-alt="<?php echo $blogpostimage['alt']; ?>">
    		<span data-src="<?php echo $blogpostimage['sizes']['is338']; ?>"></span>
    		<span data-src="<?php echo $blogpostimage['sizes']['is338_x15']; ?>" data-media="(min-device-pixel-ratio: 1.5)"></span>
    		<span data-src="<?php echo $blogpostimage['sizes']['is338_x2']; ?>" data-media="(min-device-pixel-ratio: 2.0)"></span>
    		<span data-src="<?php echo $blogpostimage['sizes']['is580']; ?>" data-media="(min-width: 400px)"></span>
    		<span data-src="<?php echo $blogpostimage['sizes']['is580_x15']; ?>" data-media="(min-width: 400px) and (min-device-pixel-ratio: 1.5)"></span>
    		<span data-src="<?php echo $blogpostimage['sizes']['is580_x2']; ?>" data-media="(min-width: 400px) and (min-device-pixel-ratio: 2.0)"></span>
    		<span data-src="<?php echo $blogpostimage['sizes']['is811']; ?>" data-media="(min-width: 675px)"></span>
    		<span data-src="<?php echo $blogpostimage['sizes']['is811_x15']; ?>" data-media="(min-width: 675px) and (min-device-pixel-ratio: 1.5)"></span>
    		<span data-src="<?php echo $blogpostimage['sizes']['is811_x2']; ?>" data-media="(min-width: 675px) and (min-device-pixel-ratio: 2.0)"></span>
    		<span data-src="<?php echo $blogpostimage['sizes']['is580']; ?>" data-media="(min-width: 970px)"></span>
    		<span data-src="<?php echo $blogpostimage['sizes']['is580_x15']; ?>" data-media="(min-width: 970px) and (min-device-pixel-ratio: 1.5)"></span>
    		<span data-src="<?php echo $blogpostimage['sizes']['is580_x2']; ?>" data-media="(min-width: 970px) and (min-device-pixel-ratio: 2.0)"></span>
    		<span data-src="<?php echo $blogpostimage['sizes']['is811']; ?>" data-media="(min-width: 1141px)"></span>
    		<span data-src="<?php echo $blogpostimage['sizes']['is811_x15']; ?>" data-media="(min-width: 1141px) and (min-device-pixel-ratio: 1.5)"></span>
    		<span data-src="<?php echo $blogpostimage['url']; ?>" data-media="(min-width: 1141px) and (min-device-pixel-ratio: 2.0)"></span>
    		<noscript><img src="<?php echo $blogpostimage['sizes']['is580']; ?>" alt="<?php echo $blogpostimage['alt']; ?>"></noscript>
    	</span>
    	<?php the_field( 'news_post' ); ?>
    <?php endwhile; ?>
    	<?php wp_reset_postdata(); ?>
    <?php else: ?>
    	<p>Entweder wir haben mit allen Partnern There are no posts or pages here</p>
    <?php endif; ?>

    no matter what i do: either if i place <?php the_field( ‘news_post’ ); ?> directly into the code like above or if i wrap it inside a p tag <p class=”bran-hn”></p> or if i wrap it in a div. always the content is wrapped inside a pre tag (in the case if the the_field call is placed inside a p tag the p is empty and the pre is placed afterwards). :/

    my basic goal would be actually instead of using the usual text area that in that field the user has the opportunity to write more than usual. even a few paragraphs. that each paragraph would be wrapped in p tags with a certain class assignment. and that there is the option to add another picture within the wysiwg editor via a short code or add a youtube link.

    so far i only get the pre wrap; but also uncertain if my goal would be even accomplishable with the wysiwg field. :/ thanks ralf

    • rpk

    • February 13, 2014 at 2:28 am

    i don’t know why and how, i’ve only pasted the content into the wysiwg field and did nothing but somehow one news post (actually the one i tested around with) got pre instead of paragraph assigned in the lower left of the rte field. :/ problem solved.

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.

We use cookies to offer you a better browsing experience, analyze site traffic and personalize content. Read about how we use cookies and how you can control them in our Cookie Policy. If you continue to use this site, you consent to our use of cookies.