How to display related post right side of content after two paragraph?

Question

I stack with a problem. my client need related Article Right side of content after one or two paragraph. I attached layout what i need. i have related posts code i just want to know how to display like showing in attachment. Attachment

score 0 · Answer 1 · edited May 23 '17 at 11:53

I'm not quite sure what you want us to do. How ever, if you just want in HTML/CSS two boxes, one to get text on the left side, and one to get information on the right side. You can just make two divs that float:left; (css). You get what you want to achieve.

HTML:

<div class="clearFix">
      <div class="left"></div>
      <div class="right"></div>
</div>

CSS:

.left { float:left; }
.right { float:left; }

Make sure to use a "clearFix" when floating div. I did this in the above example with a div with the class "clearFix". This is the CSS you need for such div:

.clearFix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

JSFiddle of the floating divs: https://jsfiddle.net/u27bfyu4/ In this example I added background colors etc. to immediately show you the result of floating divs.

If you want the text on the left, add it in the class="left" div. In the class="right" div, you can add the code to get the information.

The other paragraphs you've got in your example you can add before and after the <div class="clearFix"></div>.

What this what you where looking for?

EDIT: As you commented below, you needed information about how to insert a string of text after x paragraphs of an html fragement. Click on the link for more information as this is already explained on Stack Overflow.

not this sir, i need float div after 2 paragraph on wordpress content. i displayed on my attachment — Kaleel Rahman, Nov 27 '16 at 21:52
Could you please show us some of your code or what did you try already? Please read some information how to post on Stack Overflow. If you're more specific on what you need, and show us some of your code (which is relevant) someone can maybe help you out. I suggest (if there is no function in WordPress to get the first paragraph) to walk through the post and get the last `` and then adding this in the content. — JeroenE, Nov 27 '16 at 21:54
Maybe this is what you're looking for: http://stackoverflow.com/questions/8963835/how-to-insert-a-string-of-text-after-x-paragraphs-of-an-html-fragment? (added it also to the post) — JeroenE, Nov 27 '16 at 22:00

How to display related post right side of content after two paragraph?

1 Answers1