How to write own bootstrap style - php

This li not alignment correctly for 768×1024(tab) reamining size and all not working correctly,only it will work on 1280×600 and 320×480,How to write own bootstrap style,i don't know how to start anyone tell me...
<li class="col-md-3 col-sm-6 col-xs-12 isotope-item websites">
<div class="image-gallery-item">
<span class="thumb-info" id='thump-info'>
<div class="my-gallery" itemscope itemtype="">
<?php
$i = 0;
$sql=mysql_query("SELECT * FROM useralbum WHERE ssmid='$ssmid' ORDER BY photo_uploadedon DESC");
$count = mysql_num_rows($sql);
while($row=mysql_fetch_assoc($sql)){
?>
<figure <?php if(0 != $i) { ?>style="display:none;" <?php } ?>>
<a href="http://www.srisankaramatrimony.com/cupid/img/user-album/thumbnail/<?php echo $row['thumbnail']?>" itemprop="contentUrl" data-size="1600x1600">
<img src="http://www.srisankaramatrimony.com/cupid/img/user-album/thumbnail/<?php echo $row['thumbnail']?>" itemprop="thumbnail" alt="Image description" style='dispaly:none'/>
</a>
</figure>
<?php $i++; } ?>
</div>
<span class="thumb-info-title">
<span class="thumb-info-inner">VIEW PHOTOS</span>
<span class="thumb-info-type"><?php echo $count.' PHOTOS'?></span>
</span>
<span class="thumb-info-action">
<span class="thumb-info-action-icon"><i class="fa fa-link"></i></span>
</span>
</span>
</div>
</li>
[THis one for 800×1280 ,see the forth image width is not comming corectly]
http://i.stack.imgur.com/ouSop.png

Related

PDF files are not shown in website but working fine in localhost

I want to read my "pdf files" in PHPMYSQL tables. So I found the script from some forums and it's work fine in "localhost using XAMPP".
But When I deploy to website, it's not showing pdf files and all information after that line are missing.
I dont know what is the problem. Kindly someone can help me please...
<div class="page-title">
<div class="container">
<div class="row">
<div class="col-md-12">
<ol class="breadcrumb">
<li>Home</li>
<li>Journals</li>
<li><?php echo $title; ?></a></li>
</ol>
</div>
</div>
</div>
</div>
<section class="block-wrapper">
<div class="container">
<div class="row">
<div class="col-lg-8 col-md-12">
<div class="single-post">
<div class="post-title-area">
<a class="post-cat" href="<?php echo $post_cat_link; ?>"><?php echo $category; ?></a>
<h2 class="post-title">
<?php echo $title; ?>
</h2>
<div class="post-meta">
<span class="post-date"><i class="feather icon-clock"></i> <?php echo $post_date; ?></span>
<span class="post-comment"><i class="feather icon-eye"></i>
<span><?php echo $post_views; ?></span></span>
</div>
<div class="div1">
<?php echo "View PDF File for Journal Details" ?>
<?php
mysql_connect('localhost','adminjournal','adminjournalikat');
mysql_select_db('journal');
// mysql_connect('localhost','root','');
// mysql_select_db('journal');
$sql="SELECT pdf from tbl_blog_posts";
$query=mysqli_query($conn,$sql);
while ($info=mysqli_fetch_array($query)) {
?>
<embed type="application/pdf" src="pdf/<?php echo $info['pdf'] ; ?>" width="900" height="500">
<?php
}
?>
</div>
</div>
<div class="post-content-area">
<div class="entry-content">
<?php
if ($yt_vid == "") {
?>
<div class="post-media post-featured-image">
<img src="images/blog/<?php echo $media; ?>" class="img-fluid single_blog" alt="">
</div>
<?php
}else{
?>
<div class="post-media post-video">
<div class="embed-responsive">
<iframe src="https://www.youtube.com/embed/<?php echo $yt_vid; ?>"></iframe>
</div>
</div>
<?php
}
?>
<?php echo $cont?>
<br></br>
</div>
<div class="tags-area clearfix">
<div class="post-tags">
<span>Tags:</span>
<?php
$post_tags = explode(",",$tags);
foreach ($post_tags as $tag) {
if (WBCleanURL == "true") {
$st1 = preg_replace("/[^a-zA-Z]/", " ", $tag);
$st2 = preg_replace('/\s+/', ' ', $st1);
$tag_title = strtolower(str_replace(' ', '-', $st2));
$tag_link = "tags/$tag_title";
}else{
$tag_link = "pages/tags?key=$tag_title";
}
?><?php echo $tag; ?><?php
}
?>
</div>
</div>
<div class="share-items clearfix">
<ul class="post-social-icons unstyled">
<li class="facebook">
<a href="https://www.facebook.com/sharer/sharer.php?u=<?php echo $sharelink; ?>">
<i class="fa fa-facebook"></i> <span class="ts-social-title">Facebook</span></a>
</li>
<li class="twitter">
<a href="https://twitter.com/intent/tweet?url=<?php echo $sharelink; ?>">
<i class="fa fa-twitter"></i> <span class="ts-social-title">Twitter</span></a>
</li>
<li class="gplus">
<a href="mailto:info#example.com?&subject=&cc=&bcc=&body=<?php echo $sharelink; ?>">
<i class="fa fa-envelope"></i> <span class="ts-social-title">Email</span></a>
</li>
</ul>
</div>
</div>
</div>
thanks for your clue that this issue because of overlapping. Finally I found out the script problem... below is the right one...
Thanks a lot and Wish You All The Best
<?php echo $cont?>
<br></br>
<?php echo "PDF File Details for Journal" ?>
<br><h4><?php echo $title;?> </h4>

Display 3 post item in a for loop of bootstrap carousel in Microweber

Hello i am trying to display 3 post item of bootstrap carousel in Microweber. I am trying my luck here as not much info can be found in microweber as i am stuck for a few days. Here is my code.
<?php if (!empty($data)): ?>
<script>mw.require("<?php print $config['url_to_module']; ?>css/style.css", true); </script>
<?php $rand = 'item_carousel_'.$params['id']; $id = 'carousel_'.$params['id']; ?>
<div id="<?php print $id; ?>" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<?php $count = -1; foreach($data as $item): ?>
<?php $count++; ?>
<div class="carousel-item <?php if($count == 0){ print 'active ';} ?>">
<div class="col-12 col-md-4">
<div class="card mb-2">
<?php if($item['tn_image']): ?>
<?php endif; ?>
<div class="card-body">
<h4 class="text-center card-title"><?php print $item['title'] ?></h4>
<p class="card-text"><?php print $item['description']; ?></p>
</div>
</div>
</div>
</div>
<?php endforeach ; ?>
</div>
<!--Controls-->
<a class="carousel-control-prev " href="#<?php print $id; ?>" role="button" data-slide="prev">
<span class="fas fa-chevron-circle-left fa-2x" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#<?php print $id; ?>" role="button" data-slide="next">
<span class="fas fa-chevron-circle-right fa-2x" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
<!--/.Controls-->
</div>
<?php else : ?>
<?php endif; ?>
Currently it is display like this
But i want it to display 3 image in a row and using the control to rotate the next 3 post item.
1 - which template you are using?
2 - you can use slidesToShow: 3 in slick slider init
For example:
$('.multiple-items').slick({
infinite: true,
slidesToShow: 3,
slidesToScroll: 3
});

Bootstrap Carousel in Foreach Loop

I have Carousel with 4 images like given in the following image.
My Effort is given in following.
<div id="thumbCarousel" class="carousel slide">
<div class="carousel-inner">
<?php $i=0; foreach($this->partner_images as $sr){?>
<?php if($i==0){ ?><div class="item active"><?php } ?>
<?php if($i ==4){ ?><div class="item"><?php }?>
<div class="col-xs-3">
<a href="<?php echo $sr['url']; ?>">
<img src="<?php echo BASE_URL?>/partner-images/<?php echo $sr['name']?>" />
</a>
</div>
<?php if($i==3 or $i==7){ ?></div><?php }?>
<?php $i++; } ?>
</div>
<a class="thumbleft" href="#thumbCarousel" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a>
<a class="thumbright" href="#thumbCarousel" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span> </a>
</div>
</div>
Problem:
The problem is that it is working fine for 4 images and for 8 images, so when there are 4 or more picture are not showing properly. I want to do it automatically either images are even or odd.
Question:
My question is how i can show 4 or more images like shown in the images automatically ?
I try this and it is working fine.
<div id="thumbCarousel" class="carousel slide">
<div class="carousel-inner">
<?php $i=0; foreach($this->partner_images as $sr){?>
<?php if($i==0){ ?><div class="item active"><?php } ?>
<?php if($i % 2 == 0){ ?><div class="item"><?php }?>
<div class="col-xs-3">
<a href="<?php echo $sr['url']; ?>">
<img src="<?php echo BASE_URL?>/partner-images/<?php echo $sr['name']?>" />
</a>
</div>
<?php if($i % 4 != 0){ ?></div><?php }?>
<?php $i++; } ?>
</div>
<a class="thumbleft" href="#thumbCarousel" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a>
<a class="thumbright" href="#thumbCarousel" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span> </a>
</div>
</div>

bootstrap 2.3 multiple images / items in carousel

I am working on a PHP based website which is using Twitter Bootstrap 2. I am pulling the users from MySQL database and trying to display them in multiple frames/items of carousel on a screen rather than a single item using while loop.
This is what my carousel looks like at present, as you will notice user 5 is not supposed to appear the way it is right now and is only supposed to appear when i click on arrow on right side of the carousel.
This is what my php code looks like
<div class="carousel slide" id="myCarousel">
<h4 class="carousel-title">Text title</h4>
<div class="carousel-inner">
<?php
while ($row = $query->fetch(PDO::FETCH_ASSOC)) {
?>
<div class="item active">
<div class="span3 mef-3">
<div class="about portrait">
<div class="tooltip-demo">
<a href="#" rel="tooltip" data-placement="top" data-toggle="tooltip"
data-title="">
<img class="img-circle" width="180" height="200" data-src="holder.js/360x270"
alt="270x280"
style="" src="assets/img/adviser.png"></a>
</div>
<div class="caption">
<h3 class="name" style="text-align: center"><?php echo $row['fname']." ".$row['lname'] ?></h3>
<p style="text-align: center">
Specialities</p>
</div>
<div class="mefradio">
<input type="radio" name="adviser" id="adviser" value='<?php echo $row['user_id']."|".$row['fname']." ".$row['lname'] ?>'><br>
</div>
</div>
</div>
</div>
<?php
}
?>
</div>
<a data-slide="prev" href="#textCarousel" class="left carousel-control">‹</a>
<a data-slide="next" href="#textCarousel" class="right carousel-control">›</a>
</div>
I will really appreciate any guidance on how to get it to work
UPDATE
This is the updated code that is working, thanks to #I can Has Kittenz
<div class="carousel slide" id="myCarousel">
<h4 class="carousel-title">Text title</h4>
<div class="carousel-inner">
<?php
$i = 1;
$next_item = true;
while ($row = $query->fetch(PDO::FETCH_ASSOC)) {
if ($i == 1) {
echo '<div class="item active">';
} elseif ($next_item == true) {
echo '<div class="item">';
}
?>
<div class="span3 mef-3">
<div class="about portrait">
<div class="tooltip-demo">
<a href="#" rel="tooltip" data-placement="top" data-toggle="tooltip"
data-title="">
<img class="img-circle" width="180" height="200" data-src="holder.js/360x270"
alt="270x280"
style="" src="assets/img/adviser.png"></a>
</div>
<div class="caption">
<h3 class="name"
style="text-align: center"><?php echo $row['fname'] . " " . $row['lname'] ?></h3>
<p style="text-align: center">
Specialities</p>
</div>
<div class="mefradio">
<input type="radio" name="adviser" id="adviser"
value='<?php echo $row['user_id'] . "|" . $row['fname'] . " " . $row['lname'] ?>'><br>
</div>
</div>
</div>
<?php
$next_item = false;
if ($i % 4 == 0) {
echo '</div>';
$next_item = true;
}
$i++;
}
?>
</div>
<a data-slide="prev" href="#myCarousel" class="left carousel-control">‹</a>
<a data-slide="next" href="#myCarousel" class="right carousel-control">›</a>
</div>
The JS that needs to go with this is as following
<script>
$(document).ready(function(){
$('#myCarousel').carousel({
pause: true,
interval: false
});
});
$('#myCarousel').on('slid', '', function() {
var $this = $(this);
$this.find('.carousel-control').show();
if($('.carousel-inner .item:first').hasClass('active')) {
$this.find('.left.carousel-control').hide();
} else if($('.carousel-inner .item:last').hasClass('active')) {
$this.find('.right.carousel-control').hide();
}
});
</script>
Updated:
As per the way Bootstrap 2.3 carousel works, multiple items like the way you have done won't show 4 items in a row and only one .item class can have an .active class to it, so here's what we would do:
<div class="item active">
<div class="span3"><img></div>
<div class="span3"><img></div>
<div class="span3"><img></div>
<div class="span3"><img></div>
</div>
<div class="item">
<div class="span3"><img></div>
<div class="span3"><img></div>
<div class="span3"><img></div>
<div class="span3"><img></div>
</div>
That's how we are going to structure your elements to look like. So code in:
<!-- code follows -->
<div class="carousel-inner">
<?php
$i = 1;
$next_item = true;
while ($i < 10)
{
if ($i == 1)
{
echo '<div class="item active">';
}
elseif ($next_item == true)
{
echo '<div class="item">';
}
?>
<div class="span3 mef-3">
<!-- code follows -->
</div>
<?php
$next_item = false;
if ($i % 4 == 0)
{
echo '</div>';
$next_item = true;
}
$i++;
}
?>
Also, since you name your carousel as id=myCarousel, your prev and next button's href should be href="#myCarousel" and not href="#textCarousel".
Here's a demo of what it looks like.

remove duplicate id from an array in for loop

i have different parameters...on the products...but i want to display only those parameters that are clicked by the user.i have done this but i want to delete the duplicacy.. my code is:-
$ab=$_POST['data1'];
$karan=explode(",",$ab);
array_pop($karan);
for($i=0;$i<count($karan);$i++){
'karan['.$i.'] = '.$karan[$i];
$posts = $wpdb->get_results("SELECT * FROM demo_postmeta WHERE meta_value='".$karan[$i]."' ");
$out=array();
foreach($posts as $post){
if (!isset($out[$post->post_id])){
$out[$post->post_id][$post->meta_key]=$out;
$ram=get_the_post_thumbnail($post->post_id,"_thumbnail_id",true);
$title=get_post_meta($post->post_id,"_product_title",true);
$price=get_post_meta($post->post_id,"_product_year",true);
$link=get_post_meta($post->post_id,"_product_likes",true);
?>
<div id="itemListContent" class="in-list">
<div class="the-list">
<div class="li first row clearfix" style="cursor: pointer;">
<div class="c-1 table-cell">
<div class="cropit">
<a class="pics-lnk important-rule" href="http://uzodocs.com/PROJECTS/demo/products?post_id=<?php echo $post->post_id ?>" style="text-decoration: none;">
<?php echo $ram; ?>
</a>
</div>
</div>
<div class="second-column-container table-cell">
<h3>
<a href="http://uzodocs.com/PROJECTS/demo/products?post_id=<?php echo $post->post_id ?>" title="Kenxinda Watch Mobile Dual SIM with FREE Bluetooth Headset free home delivery - Delhi" class="important-rule" style="text-decoration: none;">
<?php echo $title; ?>
</a>
</h3>
<div class="c-4">
</div>
<span class="itemlistinginfo clearfix">
<span>
Delhi |
Cameras
- Camera Accessories
</span>
<span>
</span>
</span>
</div>
<div class="third-column-container table-cell">
<?php echo $price; ?>
</div>
<div class="fourth-column-container table-cell"><br> </div>
</div>
<div class="li even row clearfix" style="cursor: pointer;">
<div class="c-1 table-cell">
</div>
</div>
</div>
</div>
<?php
}
$out[$post->post_id][$post->meta_key][] = $post->post_id;
}
}
die;
?>
UPDATE:
This may be a way to solve your problem:
if (!in_array($post->post_id, $out)){
$out[] = $post->post_id;
You can remove the last $out[$post->post_id][$post->meta_key][] = $post->post_id;
Just put you required data into
$out[$post->post_id][$post->meta_key][] = "data you need".
and put this array out of for scope. just before die;

Categories