remove

It works! Here is the code for anyone who's working with Bootstrap and run into same problem. If you have a 4 cols lay-out change col-md-4 into col-md-3 and $i % 3 to $i % 4 <div class="container"> <?php $items = $page->children; // set the counter to 1 $i = 1; echo '<div class="row">'; foreach ($items as $item) { echo "<div class='col-md-4'> <a href='{$item->url}'><img src='{$item->werk_afbeelding->first()->url}' /> <h4>$item->werk_titel</h4> <p>$item->werk_intro</p></a></div>"; // After 3 close the row div and open a new one if($i % 3 == 0) {echo '</div><div class="row">';} //End count $i++; } ?> </div> </div>

See what happens when you make one of these cols a different height, they block following cols and align.

Please, not the Pocketgrid discusion again. It is not perfect and certainly not new. If I understand PW then PHP is smart enough. I almost got it, but the last row is still open. <div class="container"> <?php $items = $page->children; // set the counter to 1 $i = 1; echo '<div class="row">'; foreach ($items as $item) { echo "<div class='col-md-4'> <a href='{$item->url}'><img src='{$item->werk_afbeelding->first()->url}' /> <h4>$item->werk_titel</h4> <p>$item->werk_intro</p></a>"; // After 3 close the row div and open a new one if($i % 3 == 0) {echo '</div></div><div class="row">';} else{echo '</div>';} //End count $i++; } ?> </div>

I would like to keep benefits of Bootstrap. This is my latest attempt but doesn't work. <div class="container"> <div class="row"> <?php $items = $page->children; $i = 0; foreach ($items as $item) { echo "<div class='col-md-4'> <a href='{$item->url}'><img src='{$item->werk_afbeelding->first()->url}' /> <h4>$item->werk_titel</h4> <p>$item->werk_intro</p></a> </div>"; $i++; if ($i = 3) { echo "</div>"; echo "<div class='row'>"; } else { echo "</div>"; } } ?> </div> </div> The row is not closing. I added a variable i. Is this possible?

@PhotoWebMax: my images are the same size. Bootstrap uses class "img-responsive", so images resize automatically. @BernHardB: I came a little bit further. I added a link to details page but can not get it into rows. my code is now. Any suggestions? $items = $page->children; foreach ($items as $item) { echo "<div class='col-md-4'> <img src='{$item->werk_afbeelding->first()->url}' /> <h4>$item->werk_titel</h4> <p>$item->werk_intro</p> <a href='{$item->url}'>Lees meer</a> </div>"; }

I'am trying to create a simple portfolio page. It is a harder then I thought to create cols automatically. Every child is a portfolio item (image, title, text). Work -a -b -c This is what I came up with. I've been starring at it for ours but can't get it to work <?php $portfolio = $pages->get("/work/")->children; foreach($portfolio as $portfolio_item) { ?> <div class="col-md-4"> <?php echo $portfolio_item->body;?> </div> <?php } ?>

I'am trying to validate html5 and get errors on metatags. Is there a solution for this? Bad value og:site_name for attribute name on element meta: Keyword og:site_name is not registered.

The top navigation shrinks at the moment you scroll down. The logo gets smaller. Here is an example. http://www.grafik.com Does anyone have an idea how this is made.

A standard would be nice. If the name of the module was in the comment tag, I would known where it came from.

Yes, I do.

I nearly finished with my first PW site but have a strange script on the end of my page. It is not in my HTML. The last thing I did was installing AIOM+. After I tried it out I uninstalled it and deleted is from the modules folder. This is the script that shows up in my output. Who knows how to get rid of it? <!-- emo --> <script> var emo_addr = new Array(); emo_addr[0] = "Ncf4z6sn5HE9JIomaK8U+ev3hxZdyjkY1PCgV27QqwuWpXBliLGFSTt0MRAbDO.r"; emo_addr[1] = "msz1htLPy0JO57eXdTO2dv6wdf51ZnH2xgSCdv6wdnKlo72Bx7ONkQjWdtTih3JBd7iCm72Bx7ONkQjWdtTih3JBd7iD9tz."; emo_addr[2] = "msz1htLPy0JO57eXdTO2dv6wdf51ZnH2xgSCdv6wdnKlo7TwdsOT97HpdteXx3HSyScAjtXld3cPyGRBdf5.Uv2pd0+1a7LlxvT2yQKFmfOPm1NN"; emo_addr[3] = "msz1htLPy0JO57eXdTO2dv6wdf51ZnH2xgSCdv6wdnKlo7L2kfRthvMBxseB97P2j3x2dzcAjtXld3cPyGRBdf5.UseM5nxPdCcVxvM18seTj7epmfOPm1NN"; emo_addr[4] = "msz1htLPy0JO57eXdTO2dv6wdf51ZnH2xgSCdv6wdnKlo7e2dsIl97K297wld7jNkQjWdtTih3JBd7iCmVe2dsIl5sK25zwld7yD9tz."; emo_addr[5] = "msz1htLPy0JO57eXdTO2dv6wdf51ZnH2xgSCdv6wdnKlo72Bx7ONkQjWdtTih3JBd7iCmgLwdvy1htLPy0JO57L2xQa1ys6Vxs2BxtHljnKldUzT5Cc0ZvKSZ4SCJUNiH851y0Hgm85lyt2Sx8OSxvTids6Sx3JlZvTPxteF9tXBd0NXIfTBd0HXhviBZQcQ5CcPdnaO5C51dtRXd0eFxvOtx35O5QKqZ3JBy0Hgm8ylyt2Sx8OSxvTids6Sx3JlZvTPxteF9tXBd0NXIfTqd0x2yCRuysyQ5Ccld7Tlj3I2d0eSm8HSZs2F9QIGhFSQ90Iwjs+ljseXysLPjseF9t2Xhvj2yGOWd7Oi9UaXd7OGdv6p97wixGyC5fD.mfOPm1NN"; emo_addr[6] = "msz1htLPy0JO57eXdTO2dv6wdf51ZnH2xgSCdv6wdnKlo72Bx7ONkQjWdtTih3JBd7iCmgLwdvy1htLPy0JO57L2xQa1ys6Vxs2BxtHljnKldUzT5Cc0ZvKSZ4SCJUNiH851y0Hgm85lyt2Sx8OSxvTids6Sx3JlZvTPxteF9tXBd0NXI8TBd0HXhviBZQcQ5CcPdnaO5C51dtRXd0eFxvOtx35O5QKqZ3JBy0Hgm8ylyt2Sx8OSxvTids6Sx3JlZvTPxteF9tXBd0NXI8Tqd0x2yCRuysyQ5Ccld7Tlj3I2d0eSm8HSZs2F9QIGhFSQ90Iwjs+ljseXysLPjseF9t2Xhvj2yGOWd7Oi9U+Xd7OGdv6p97wixGyC5fD.mfOPm1NN"; addLoadEvent(emo_replace()); </script> </body> </html>

I've had the same problem last week. Installed PW with different template (intermediate), replaced files and search was working fine.

Hope you can help me out... I have a different template for my mobile version using two media queries @media only screen and (min-device-width : 768px) and mobile @media only screen and (max-width: 767px) My goal is to hide elements for the mobile template on phones to reduce loading time. I want to use this module and add display: none. I can't get it to work. In settings I added two Base classnames 767px small 768px large Added a style and class with div <style> .small { } .large .hiddenphone { display: none } </style> <div class="hiddenphone"> <div class="container"> <div class="row"> <div class="col-md-12"> <img class="img-responsive" src="<?php echo $config->urls->templates; ?>images/logo.jpg" width="235" alt="" /> </div> </div> </div> </div> Is this approach possible?

Can't install the modele. There is an error message. I'am using latest PW.

@Martijn I've used on my own layout and works. Is it invalid CSS?

33% is not accurate enough. Set the column width to .width33{width:33.33333333%}

@kongondo I have installed 2.0.2 and am working on the frontpage of my site. The two latest news items are shown like this. <div class="block-group"> <div class="block width100"> <?php $blog = $modules->get("MarkupBlog"); echo $blog->renderPosts("limit=2", true); ?> </div> </div> Is it possible to print them next to each other. Perhaps call items twice? Call 1st item, then skip 1st and call 2nd item <div class="block-group"> <div class="block width50"> <?php $blog = $modules->get("MarkupBlog"); echo $blog->renderPosts("limit=1", true); ?> </div> <div class="block width50"> <?php $blog = $modules->get("MarkupBlog"); echo $blog->renderPosts("limit=1", true); ?> </div> </div>

Running very smootly. Interface gets used too very quick, love it. Only thing I updated was a driver for a pen-tablet.

I love the combination of PW and Pocketgrid but ran into a problem. I know this is actually a CSS question and not a PW specific question, hope somebody can help. When I place a image in a Block. An unwanted margin (red in attached file) is placed at the bottom. I'v tried putting padding and padding to zero in different ways but it just won't work. Does anyone has got a similar experience? <div class="wrapper"> <div class="block-group"> <div class="block width100 bgred"><img src="<?php echo $config->urls->templates?>images/stappen-top.jpg" alt="" width="960px" /></div> <div class="block width33 bgddd">block 1</div> <div class="block width33 bgddd">block 2</div> <div class="block width33 bgddd">block 3</div> <div class="block width100 bgred"><img src="<?php echo $config->urls->templates?>images/stappen-bottom.jpg" alt="" width="960px" /></div> </div> </div>

WoW.., sounds great! I was looking for this.

Great tutorial. Very helpful, thank you! Is it possible to exclude pagination only on the homepage render posts? For example to set MarkupPagerNav to false.

I can't get the code to work and hope you can help me.., beginner you know. On the home page I would like to have the 3 latest posts, only title and the first part of the post. hiding post-byline works fine. I used the code you advised. Is it possible to get latest posts and not only from a certain category. I have tried to put in my three categories (1042, 1043, 1044) ID's but that doesn't work. $blog = $modules->get('MarkupBlog'); $category = $pages->get(1043);//This is ID of category'Fanions'. Can also get by other selector, e.g. name, title, etc. $posts = $pages->find("template=blog-post, blog_categories=$category, limit=3"); echo $blog->renderPosts($posts); Is it possible to truncate the post length? For example a function from a other post by Ryan.

@yellowled The listing of items work fine! Thx for the example. For anyone who want to use the code, there was a minor bug in item-list. // Get all children of the categories page $categories = $pages->get('/categories/')->children; // Create buttons for all categories echo "<div class='filter'>"; Filter: foreach ($categories as $cat) { echo "<button class='show-cat' data-show='" . strtolower($cat->title) . "' type='button'>{$cat->title}</button>"; } echo "</div>"; // Get all child pages, i.e. items $items = $page->children; // List all items echo "<ul class='items'>"; foreach ($items as $item) { echo "<li class='" . strtolower($item->itemcategory->title) . "'><a href='{$item->url}'>{$item->title} ({$item->itemcategory->title})</a></li>"; } echo "</ul>"; The filter part is a different chapter. The jQuery solution doesn't work for me. Is there an other way to exclude/filter items from the list?

@ OrganizedFellow: Thx for this link! I like the script but is it possible to include a file based on screen width (@mediaonlyscreenand(max-width:767px)?

Fantastic work. I'am now testing 2.02. I'am not going to use Tags and Authors. Is it possible to hide them in Admin so users can't see them?