• Hello everybody,

    Within a widget I have a small HTML “<div></div> layout” with a few text lines and at the end of these text lines (but inside the div layout), I want to show a little excerpt of the most recent post.

    May somebody know how can I do this? it is possible?

    PS: For reference I’m using Weaver theme under Wordpreess 3.2.1

    Many thanks in advance.

Viewing 10 replies - 1 through 10 (of 10 total)
  • Hi Aloris, if you need help with using shortcodes within a WordPress Text Widgit, please see:

    How can I use shortcodes within a WordPress Text widget?

    Thread Starter Aloris

    (@aloris)

    Hi Brad,

    Thanks for your answer. It works separately (1rst HMTL code, after [shortcode]), but is possible to include
    the [shortcode] inside the HTML code?

    I mean, have the output of the [shortcode] within output of the the div layout?

    something like:

    <div class="MyClass">
      <p align="center" class="style1">&nbsp;</p>
      <p align="center" class="style1"><strong>Text1</strong></p>
     <strong>  [shortcode]</strong>
     </div>

    Thanks for help so far.

    Regards

    Hi Aloris. Yes, I just tested and it does work.

    Thread Starter Aloris

    (@aloris)

    Certainly it works!!!

    Many thanks Brad for your kindly and useful support.

    Best regards

    Thread Starter Aloris

    (@aloris)

    The last question about this, sorry.

    The output of the shortcode is displayed within div layout, but is left justified.

    How can I align to center the output of shortcode?

    Thanks again for the help.

    Regards

    Use CSS to target the div?

    Thread Starter Aloris

    (@aloris)

    I’m using CSS to format the fixed text divs, I’ve only added below last div the [shortcode].

    I need to add another div to control [shortcode] format?

    May you help me how can I do it please.

    Thanks in advance.

    Give the div you’re putting the shortcode in an ID, then just add formatting to target that ID in your CSS file.

    Thread Starter Aloris

    (@aloris)

    Hi fonglh,

    This is my code:

    <style type='text/css'>
    .MyClass{
    	top: 10px;
      	background-color:#D11567;
    	width: 200px;
    	font-size: 17px;
    	text-align: center;
    }
    .content2 .style1 {
    	color: #000000;
    	font-size: 20px;
    	font-family: Tahoma, Arial, sans-serif;
    	margin: 0 auto;
    }
    .content2 .style2 strong em {
    	color: #FFFFFF;
    }
    .content2 .style1 {
    	font-size: 18px;
    }
    .content2 p strong {
    	color: #000;
    }
    .content2 .style2 strong {
    	color: #FFF;
    }
    
    </style>
    	 <div class="MyClass">
         	<div class="content2">
    		  <p class="style1">&nbsp;</p>
    		  <p class="style1"><strong>TITLE</strong></p>
    			<p class="style2"><strong>Text 1</strong></p>
              <p class="style2"><strong>Text2</strong></p>
              <p><a href="http://example.com/"><img src="http://mypage.com/myimage.png" height="21" width="83"></a></p>
    <p align="center" class="style2">&nbsp;</p>                  
    
    	    </div>
    	 </div>

    I had problems because I was trying with
    margin-left: auto;
    margin-right: auto;

    and with
    margin: 0;

    But the way it works is
    { text-align: center;}

    It centers even the image I have in the div layout. The only doubt if will work in majors browsers.

    Thanks for your help again.

    Regards

    Put the image inside yet another div and use CSS to center it. That should override the { text-align:center; } from the parent div.

Viewing 10 replies - 1 through 10 (of 10 total)

The topic ‘Shortcode inside HTML code? is possible?’ is closed to new replies.