Qurus

Hi, Can anyone tell me whats wrong with my code here please. I am trying to blog page with images and small text. Small texts are ok but images showing only one. Any help, would be greatly appreciated. <?php //CALL THE MODULE - MarkupBlog $blog = $modules->get("MarkupBlog"); $limit = 10; $post = $pages->get('template=blog-post, sort=blog_date'); $image = $post->blog_images->first(); ?> <div class="jumbotron"> <h3><?php echo $page->title ?></h3> </div> <!-- /.Header_End --> <div class="main-content container"> <div class="row"> <!-- Blog --> <div class="blog-list"> <div class="row"> <div class="col-md-6 post-list"> <div class="ih-item square effect9 right_to_left"><a href="#"> <div class="img img-responsive"><img src="<?php echo $image->url; ?>" alt="img"></div> <div class="info"> <div class="info-back"> <h3></h3> <p></p> </div> </div></a> </div> </div> <div class="col-md-6 post-list"> <?php echo $blog->renderPosts("limit={$limit}", true); ?> </div> </div><!-- row_end--> </div> </div> </div>

Mine like this in _header.php I use css files <!-- CSS Global Compulsory --> <link rel="stylesheet" href="<?php echo $config->urls->templates?>assets/plugins/bootstrap/css/bootstrap.min.css"> <link rel="stylesheet" href="<?php echo $config->urls->templates?>assets/css/style.css"> <link rel="stylesheet" href="<?php echo $config->urls->templates?>assets/css/pages/page_pricing.css"> <!-- CSS Implementing Plugins --> <link rel="stylesheet" href="<?php echo $config->urls->templates?>assets/plugins/line-icons/line-icons.css"> <link rel="stylesheet" href="<?php echo $config->urls->templates?>assets/plugins/sky-forms/version-2.0.1/css/custom-sky-forms.css"> <link rel="stylesheet" href="<?php echo $config->urls->templates?>assets/plugins/font-awesome/css/font-awesome.min.css"> <link rel="stylesheet" href="<?php echo $config->urls->templates?>assets/plugins/horizontal-parallax/css/horizontal-parallax.css"> <link rel="stylesheet" href="<?php echo $config->urls->templates?>assets/plugins/flexslider/flexslider.css"> <link rel="stylesheet" href="<?php echo $config->urls->templates?>assets/plugins/owl-carousel/owl-carousel/owl.carousel.css"> <link rel="stylesheet" href="<?php echo $config->urls->templates?>assets/plugins/bxslider/jquery.bxslider.css"> <link rel="stylesheet" href="<?php echo $config->urls->templates?>assets/plugins/fancybox/source/jquery.fancybox.css"> <link rel="stylesheet" href="<?php echo $config->urls->templates?>assets/css/pages/portfolio-v1.css"> <link rel="stylesheet" href="<?php echo $config->urls->templates?>assets/css/pages/page_contact.css"> <!-- CSS Theme --> <link rel="stylesheet" href="<?php echo $config->urls->templates?>assets/css/theme-colors/brown.css" id="style_color"> <link rel="stylesheet" href="<?php echo $config->urls->templates?>assets/css/theme-skins/dark.css"> <!-- CSS Customization --> <link rel="stylesheet" href="<?php echo $config->urls->templates?>assets/css/custom.css"> </head> In _footer.php I use script files. <!-- JS Global Compulsory --> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <script type="text/javascript" src="<?php echo $config->urls->templates?>assets/plugins/jquery/jquery-migrate.min.js"></script> <script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script> <!-- JS Implementing Plugins --> <script type="text/javascript" src="<?php echo $config->urls->templates?>assets/plugins/back-to-top.js"></script> <script type="text/javascript" src="<?php echo $config->urls->templates?>assets/plugins/flexslider/jquery.flexslider-min.js"></script> <script type="text/javascript" src="<?php echo $config->urls->templates?>assets/plugins/owl-carousel/owl-carousel/owl.carousel.js"></script> <!-- JS Customization --> <script type="text/javascript" src="<?php echo $config->urls->templates?>assets/js/custom.js"></script> <!-- JS Page Level --> <script type="text/javascript" src="<?php echo $config->urls->templates?>assets/js/app.js"></script> <script type="text/javascript" src="<?php echo $config->urls->templates?>assets/js/plugins/fancy-box.js"></script> <script type="text/javascript" src="<?php echo $config->urls->templates?>assets/js/plugins/revolution-slider.js"></script> <script type="text/javascript" src="<?php echo $config->urls->templates?>assets/plugins/horizontal-parallax/js/sequence.jquery-min.js"></script> <script type="text/javascript" src="<?php echo $config->urls->templates?>assets/plugins/horizontal-parallax/js/horizontal-parallax.js"></script> <script type="text/javascript" src="<?php echo $config->urls->templates?>assets/js/pages/page_contact_advanced.js"></script> <script type="text/javascript" src="<?php echo $config->urls->templates?>http://maps.google.com/maps/api/js?sensor=true"></script> <script type="text/javascript" src="<?php echo $config->urls->templates?>assets/plugins/gmap/gmap.js"></script> <script type="text/javascript"> jQuery(document).ready(function() { App.init(); App.initSliders(); ContactPage.initMap(); PageContactForm.initPageContactForm(); StyleSwitcher.initStyleSwitcher(); }); </script> <!--[if lt IE 9]> <script src="assets/plugins/respond.js"></script> <script src="assets/plugins/html5shiv.js"></script> <script src="assets/js/plugins/placeholder-IE-fixes.js"></script> <![endif]--> </body> </html> Is there a way I can put page template separately js and css files? I was checking with firebug trying to read from every page scripts.

Hi, I was checking and have really script conflict issues. Can you tell me please how can I call every pages script and css separately ? Because my template is _header.php and _footer.php prependTemplateFile and appendTemplateFile from config.php.

My html version working. <!-- Carousel --> <div class="col-md-6"> <div class="carousel slide carousel-v1" id="myCarousel"> <div class="carousel-inner"> <div class="item active"> <img alt="" src="assets/img/main/12.jpg"> <div class="carousel-caption"> <p>Facilisis odio, dapibus ac justo acilisis gestinas.</p> </div> </div> <div class="item"> <img alt="" src="assets/img/main/13.jpg"> <div class="carousel-caption"> <p>Cras justo odio, dapibus ac facilisis into egestas.</p> </div> </div> <div class="item"> <img alt="" src="assets/img/main/11.jpg"> <div class="carousel-caption"> <p>Justo cras odio apibus ac afilisis lingestas de.</p> </div> </div> </div> <div class="carousel-arrow"> <a data-slide="prev" href="portfolio_item1.html#myCarousel" class="left carousel-control"> <i class="fa fa-angle-left"></i> </a> <a data-slide="next" href="portfolio_item1.html#myCarousel" class="right carousel-control"> <i class="fa fa-angle-right"></i> </a> </div> </div> </div> <!-- End Carousel -->

Hi Diego, thats owl carousel.

Hi kongondo, If it's possible can you show me exact code for this slider arrow links? I think, I did not quite understand. Sorry for being very noob. Thanks .

Can you recommend another slider. I think I am lost here with this next and prev.

Hi diogo, Thanks for your reply. Really appreciated. <div class="carousel-arrow"> <a data-slide="prev" href="<?php echo $page->images->getPrev($image)->url; ?>#myCarousel" class="left carousel-control"> <i class="fa fa-angle-left"></i> </a> <a data-slide="next" href="<?php echo $page->images->getNext($image)->url; ?>#myCarousel" class="right carousel-control"> <i class="fa fa-angle-right"></i> </a> </div> </div> I have added like this. But I have still issues. Could you help me please with that?

<div class="col-md-6"> <div class="carousel slide carousel-v1" id="myCarousel"> <div class="carousel-inner"> <?php $x=1; foreach($page->images as $image): $y=$x++; ?> <div class="item<?php if($y==1) { echo 'active'; } ?>"> <img class="img-responsive" src="<?php echo $image->url; ?>" /> <div class="carousel-caption"> <p><?php echo $image->description; ?></p> </div> </div> <?php endforeach; ?> </div> <div class="carousel-arrow"> <a data-slide="prev" href="<?php echo $image->url; ?>#myCarousel" class="left carousel-control"> <i class="fa fa-angle-left"></i> </a> <a data-slide="next" href="<?php echo $image->url; ?>#myCarousel" class="right carousel-control"> <i class="fa fa-angle-right"></i> </a> </div> </div> Hi I am making a single portfolio page. Added carousel slider. But couldn't make prev and next button work with images. Can anyone tell me please how to make this working like normal slide html version ? Like this did not work prev and next arrows. Thanks .

Thanks a lot thistimj. Worked like a charm.

Hi thistimj, I set child pages for multiple images each. But I want to show only one image on list template. Thanks

<?php foreach($page->images as $image) : ?> <img class="img-responsive" src="<?php echo $image->url; ?>" alt="<?php echo $image->description; ?>" width="<?php echo $image->width; ?>" height="<?php echo $image->height; ?>" /> <?php endforeach; ?> <?php foreach($page->children as $k => $p): ?> <div class="mask"> <h2><?php echo $p->headline; ?></h2> <?php echo $p->body; ?> <a href="<?php echo $p->url; ?>" class="info"><?php echo $p->title; ?></a> </div> </div> <?php endforeach; ?> Hi Adrian, Thanks for your reply and warm welcome message. My php knowledge is limited. But I am trying to portfolio list with images and text. I want to add children to images body and title also see on list page. I think my images code there messed. Thanks again

Hi, How do I can get image from children to my portfolio list? I was checking forum couldn't find anything.