SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Zealot
    Join Date
    Mar 2013
    Location
    Philippines
    Posts
    123
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Trying to create a grid/column shortcode

    I have been going back and forth, doing a lot of trial and error. What i want to output is a grid/column shortcodes.

    For example [column_one]Lorem Ipsum[/column_one]

    so far this is what i have came up

    Code:
    /*Grid Shortcode*/
    function grid_one($content = null) {
        return '<div class="one columns">'.$content.'</div>';
    }   
    
    add_shortcode('column_one', 'grid_one' );
    when try to apply the opening and closing shortcode. My text seems to disappear. I'm using skeleton framework and my CSS for that stylesheet is located in this folder called "CSS".

    CSS/Skeleton.css

    When i tried to create a clearfix shortcode. It seems to be working fine with no problems and it clears the floated elements. Here is the code.

    Code:
    //Clear Shortcode
    function clear_fix($content = null) {
        return '<div class="clearfix"></div>';
    }
    
    add_shortcode ('clear', 'clear_fix');

  2. #2
    SitePoint Zealot
    Join Date
    Mar 2013
    Location
    Philippines
    Posts
    123
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok so i managed to solve my shortcode. Now i have another problem. The grid worked but the first paragraph doesn't have any styling but the 2nd and 3rd have styling http://i255.photobucket.com/albums/h...ps75ea6335.png

  3. #3
    SitePoint Member
    Join Date
    Oct 2012
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Should you take a look into any parts. From my idea, you maybe lost end tag on the first graph.

  4. #4
    SitePoint Zealot
    Join Date
    Mar 2013
    Location
    Philippines
    Posts
    123
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by UpReseller View Post
    Should you take a look into any parts. From my idea, you maybe lost end tag on the first graph.
    I just the view source in my website and it seems it's missing a opening <p> tag in the first paragraph and a closing </p> tag in the second when i apply a shortcode. Really frustrating not sure how i can solve this. Styling is fine when i don't apply any shortcode

    Code:
    <div class="page-format">       
           <div id="responsive-image-container" class="sixteen columns responsive-image-container"><div class="responsive-image"><br />
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ornare lacinia blandit. Nam sodales eu metus a viverra. Aenean ac suscipit odio. Nullam ac dignissim neque, sed fringilla felis! Etiam egestas tellus sed posuere ultricies</p>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ornare lacinia blandit. Nam sodales eu metus a viverra. Aenean ac suscipit odio. Nullam ac dignissim neque, sed fringilla felis! Etiam egestas tellus sed posuere ultricies<br />
    </div></div>
    
    <div class="clearfix"></div>


Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •