I have been trying to create a blog with its list view inline I can't seem to get it. I tried to work it out using display inline but it is not working anyone with an idea. I am trying to achieve the list view on humansofnewyork. This what I have done but it isn't working

Code: Select all

<cms: masterpage='blog.php'>
<ul style="width: 80%; /* 1000px / 1250px */
            font-size: 0.8125em; /* 13 / 16 */
            max-width: 92.3em; /* 1200px / 13 */
            margin: 0 auto;
            padding: 1em 0px;
            color: #333;
            line-height: 1.5em;
            position: relative;"><li style="display: inline;
   width: 32.2%;
   margin-right:1.6%
"><cms:show k_page_title /><cms:show blog_content /></li></ul>

</cms:pages>

[KK]

Hi,

The opening <cms:pages> tag is missing from your code -

<cms: masterpage='blog.php'>
..
..
</cms:pages>

Please rectify the code to make it as follows

<cms:pages masterpage='blog.php'>
..
..
</cms:pages>

As an aside, I always find using text editors (I use Notepad++) that highlight matching tags very helpful in avoiding dangling tags.

Hope it helps.

[KK]

Another point that I noticed in your code is that you are using the <UL> element within the <cms:pages> loop -

Code: Select all

<cms:pages masterpage='blog.php'>
    <ul>
        <li><cms:show k_page_title /><cms:show blog_content /></li>
    </ul>
</cms:pages>

This will cause the <UL></UL> block to be outputted multiple times (as many times as there are pages fetched).

The correct way would be to put the <UL></UL> outside the <cms:pages> block and only let the <LI> elements repeat with the pages as follows -

Code: Select all

<ul>
<cms:pages masterpage='blog.php'>
    <li><cms:show k_page_title /><cms:show blog_content /></li>
</cms:pages>
</ul>

Hope it helps.

I just tried out

Code: Select all

<ul>
<cms:pages masterpage='blog.php'>
    <li style="display: inline;width: 32.2%;margin-right:1.6%"><cms:show k_page_title /><cms:show blog_content /></li>
</cms:pages>
</ul>

it still wouldn't display inline

[KK]

I'm not sure exactly how you mean "display inline".
The following code should give you a unordered list of blog pages.

Code: Select all

<ul>
<cms:pages masterpage='blog.php'>
    <li><cms:show k_page_title /><cms:show blog_content /></li>
</cms:pages>
</ul>

If it does not, make sure you are specifying the right template as 'masterpage'.

If, however, it does show a list as expected, that is where Couch's role ends.
If you specify <li style="display: inline;width: 32.2%;margin-right:1.6%"> (or anything else for that matter), Couch will faithfully output it absolutely unchanged.

Do a view-source and confirm that your style code is being outputted correctly.

If the code is not working as expected, that is a front-end issue and you as the designer are better placed to debug that. Begin by testing if the code works in static HTML.

Hope it helps.