0

I'm trying to create a custom wordpress theme. Everything has gone fine, except image formatting in post content. Image captions are not displaying properly in newly created theme. I have already added wordpress core css as given below.

.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

.alignright {
    float:right;
    margin: 5px 0 20px 20px;
}

.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

a img.alignnone {
    margin: 5px 20px 20px 0;
}

a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.wp-caption {
    background: #fff;
    border: 1px solid #f0f0f0;
    max-width: 96%; /* Image does not overflow the content area */
    padding: 5px 3px 10px;
    text-align: center;
}

.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
    margin: 5px 0 20px 20px;
}

.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

.wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0 4px 5px;
}

And I'm using following code to display my post content

<?php get_header(); ?>

<div class="row">

    <div class="col-md-8">
    <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
        <h2><?php the_title(); ?></h2>
        <p><em><?php the_time('l, F jS, Y'); ?></em></p>

        <?php $content = get_the_content(); ?>
        <div class="post-content img-responsive">
            <?php echo $content?>
        </div>

        <hr>
        <?php comments_template(); ?>
    <?php endwhile; else: ?>
        <p><?php _e('Sorry, this page does not exist'); ?></p>
    <?php endif; ?>
    </div>


    <div class="col-md-4">
        <?php get_sidebar(); ?>
    </div>
</div>

<?php get_footer(); ?>

It makes some captions properly. Still some captions are not arranged properly, they are dumped into screen as in wordpress editor. Images with caption are shown as given. Current problem

What should I do to display all post contents properly?

6
  • Can you clarify or provide a better description of the problem/question? I'm not sure what you are trying to solve.
    – jdm2112
    Oct 21, 2014 at 13:35
  • What is the code that displays respective post content?
    – Rarst
    Oct 21, 2014 at 13:41
  • I'm using the_content() to display post content
    – niyasc
    Oct 21, 2014 at 15:56
  • You may find my code here in github. github.com/niyasc/TechnoRevolution3
    – niyasc
    Oct 21, 2014 at 15:58
  • @mysac, please localize the problem and add the relevant code here. No one is going to read all your code to find the problem with it. The problem is probably with bad handling of own of the shortcodes you have created in your theme so first step is to comment out all the code that you have that adds new shortcodes. Oct 21, 2014 at 16:14

1 Answer 1

1

Don't know what was the actual problem. Using following syntax to display content solved problem.

<div>
    <h tag><?php the_title(); ?></h tag>
    .............other things like date and author
    <div>
         <?php the_content(); ?>
    </div>
</div>

Any way, thanks for everybody who tried to answer my question.

1
  • Yes, the problem is that shortcodes are processed by a the_content filter. Calling the_content() applies the filter whereeas echoing get_the_content() doesn't - you'd have to apply the filter yourself.
    – Rup
    Jun 29, 2021 at 9:13

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.