I have this carousel that I want to make dynamic. To operate, the carousel must begin with a class
<div class="item active">
and must stay out of the while loop. After the fourth record extract, the class must become simply
<div class="item">
In summary:
0 to 4 -> <div class="item active">
5 to 8 --><div class="item">
9 to 12 --> <div class="item"> ....so on
How do I count the records extracted?
Thanks
<?php
$banner = "SELECT * FROM tbl_banner";
$result_b = dbQuery($banner);
// here --> <div class="item active"> or <div class="item">
while($row_b = dbFetchAssoc($result_b)) {
extract($row_b);
?>
<div class="col-md-3">
<div class="w-box inverse">
<div class="figure">
<img alt="" src="banner/<?php echo $img; ?>" class="img-responsive">
<div class="figcaption bg-2"></div>
<div class="figcaption-btn">
<i class="fa fa-plus-circle"></i> Zoom
<i class="fa fa-link"></i> View
</div>
</div>
<div class="row">
<div class="col-xs-9">
<h2><?php echo $img_title; ?></h2>
<small><?php echo $img_desc; ?></small>
</div>
</div>
</div>
</div>
<?php
}
?>
You can use num_rows to see how many rows were returned. Unfortunately from your question I can't tell whether you're using MySQL, MySQLi or PDO as it seems you pass all your queries into a class.
For MySQLi use the following:
$num = $result_b->num_rows;
SELECT COUNT(*) AS cnt FROM tbl_banner
OR
count( $res ); # in php
Also see: Which is fastest? SELECT SQL_CALC_FOUND_ROWS FROM `table`, or SELECT COUNT(*)
I don't understand....
I would like a result like this, explained in this way:
$query ="SELECT .....
<div class="row">
<div class="item active">
while {
<div1>...</div>
<div2>...</div>
<div3>...</div>
<div4>...</div>
} //end while
</div>
</div>
<div class="row">
<div class="item">
while {
<div4>...</div>
<div6>...</div>
<div7>...</div>
<div8>...</div>
} //end while
etc etc
Related
I'm building a site in Wordpress that featured a list of events (posts) at can be categorized into different cities (Categories).
I'm aiming to be able to filter these events (posts) by the city (Category) in which they appear.
How do I filter the events by category?
Any help would be greatly appreciated, thank you.
Wordpress Categories assigned to Event posts
Event = cat4
City A = cat6
City B = cat5
Uncategorized = cat7
<div class="row justify-content-center row-padding" id="brands">
<div class="col-9">
<div class="row justify-content-center">
<div class="col-10">
<div class="animatedParent animateOnce">
<?php if( get_field('brands_title') ):?>
<h1 class="mb-3 animated fadeInUpShort"><span><?php the_field('events_title');?></span></h1>
<?php endif;?>
<?php if( get_field('brands_intro') ):?>
<h4 class="mb-5 animated fadeInUpShort"><?php the_field('events_intro');?></h4>
<?php endif;?>
</div>
</div>
<div class="col-1">
</div>
<div class="col-1 align-self-center animatedParent animateOnce" style="z-index:99;">
<div class="dropdown animated fadeInUpShort">
<button class="btn filter-button dropdown-toggle" type="button" id="dropdownMenuButton1" data-bs-toggle="dropdown" aria-expanded="false">
Filter by City
</button>
<ul class="dropdown-menu" aria-labelledby="dropdownMenuButton1">
<li><a class="dropdown-item" href="#">City A</a></li>
<li><a class="dropdown-item" href="#">City B</a></li>
<li><a class="dropdown-item" href="#">Uncategorized</a></li>
</ul>
</div>
</div>
</div>
<div class="row justify-content-center animatedParent animateOnce" data-sequence="100">
<?php
$brandPosts = new WP_Query('cat=4&posts_per_page=99');
if ($brandPosts->have_posts()) {
$i=1;
while ($brandPosts->have_posts()) {
$brandPosts->the_post();
?>
<div class="col-4 animated fadeIn mb-5 pb-3" data-id="<?php echo $i; ?>">
<div class="row justify-content-center">
<div class="col-12 text-center">
<img alt="<?php the_title(); ?>" src="<?php the_post_thumbnail_url(); ?>" class="img-fluid rounded-circle mb-3">
</div>
</div>
<div class="row">
<div class="col-10 offset-2">
<h2 class="mb-0"><?php the_title(); ?></h2>
<p><?php echo excerpt(16); ?></p>
See More
</div>
</div>
</div>
<?php
$i++;
}
} else {
//echo 'No content found';
}
wp_reset_postdata();
?>
</div>
</div>
</div>
Why not create a custom WordPress template for example country-posts-archive.php and implement a custom post query with the desired filters.
$categories_args = array(
'orderby' => 'menu_order', //prefered order
'taxonomy' => 'product_cat', // the taxonomy we want to get terms of
'exclude' => '17, 69', //exclude something
);
and then use it in a wp post loop, also you can play around in orderby.php
Or, simply non-coding way just use side Plugin, for example:
https://wordpress.org/plugins/blog-designer/
Also you can do it in a bit tricky way, populate dropdown with links to archive pages e.g.
www.website.com/category/your-category
code i have written below is working fine but at the end of the looping the div is not closed its still opening a loop
<div class="carousel-inner">
<div class="item active">
<div class="row">
<?php
$recent_projects_sql="SELECT * from recent_projects where service_type='upholstery'";
$recent_projects_conn=mysql_query($recent_projects_sql) or die(mysql_error());
$i=0; $split=0;
while($projects=mysql_fetch_array($recent_projects_conn)) {
$i++;
?>
<div class="col-sm-3">
<div class="col-item" style="">
<div class="photo-shadow"></div>
<div class="photo">
<img src="admin/assets/images/uploads/projects/<?php echo $projects['attachment1']; ?>" alt="User one">
</div>
<div class="info">
<div class="name">
<?php echo $projects['service_name']; ?>
</div>
<div class="degination">
<?php echo $projects['sub_title']; ?>
</div>
<div class="buttons">
<a class="btn btn-theme ripple-effect" href="#">View More</a>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
<?php
$split++;
if ($split % 4 == 0){
echo '</div></div><div class="item"><div class="row">';
}
}
?>
</div>
</div>
The Div has splited very well but in end of the loop div has not been closed. Thats only the problem please provide me the help to sort out the problem
When I inspect the element the last loop will show at the given result as follows:
<div class="col-sm-3">
<div class="col-item">
<div class="photo-shadow"></div>
<div class="photo">
<img src="admin/assets/images/uploads/projects/1557301934.jpg" alt="User one">
</div>
<div class="info">
<div class="name">UPHOLSTERY</div>
<div class="degination">UPHOLSTERY</div>
<div class="buttons">
<a class="btn btn-theme ripple-effect" href="#">View More</a>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
</div></div><div class="item"><div class="row">
I want to remove the two opening div's as dynamically. How can i set this to remove opened div's at then end of the looping
I just took a quick look and it looks like you are not closing the "carousel-inner" div
<div class="carousel-inner">
<div class="item active">
<div class="row">
<?php
$recent_projects_sql = "SELECT * from recent_projects where service_type='upholstery'";
$recent_projects_conn = mysql_query( $recent_projects_sql ) or die( mysql_error() );
$i = 0;
$split = 0;
while ( $projects = mysql_fetch_array( $recent_projects_conn ) ) {
$i ++;
?>
<div class="col-sm-3">
<div class="col-item" style="">
<div class="photo-shadow"></div>
<div class="photo">
<img src="admin/assets/images/uploads/projects/<?php echo $projects['attachment1']; ?>"
alt="User one">
</div>
<div class="info">
<div class="name">
<?php echo $projects['service_name']; ?>
</div>
<div class="degination">
<?php echo $projects['sub_title']; ?>
</div>
<div class="buttons">
<a class="btn btn-theme ripple-effect" href="#">View More</a>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
<?php $split ++;
if ( $split % 4 == 0 ) {
echo '</div></div><div class="item"><div class="row">';
}
}
?>
</div>
</div>
Add a Boolean check for the execution of loop, such as $check = true;, add this within the loop.
after the loop add this
if($check){
echo " </div></div>";
}
That's because at the end of iteration (in case of mod 4 and even without it), you keep 2 divs opened
echo '</div></div><div class="item"><div class="row">';
I have custom post type of doctors. When the name is clicked it will take to the single page of the doctor. Below there is a small div which displays a number of posts. I dont want the post which is already displayed at the top to be at the bottom.
this is the code i have done:
<?php foreach($dr as $doc){ ?>
<div class="col-md-4">
<img src="<?php echo get_the_post_thumbnail_url($doc->ID);?>" class="img-reposive img-circle dc-img mb50" alt="" />
</div>
<div class="col-md-8">
<div class="dr-single-box">
<h3 class="dr-single-tile"><?php echo $doc->post_title; ?></h3>
<div class="sub-tile"><?php echo get_post_meta($doc->ID,'Department',true); ?></div>
<div class="dc-single-social">
<p><?php echo $doc->post_content; ?></p>
make an appointment
<div class="row">
<div class="col-md-4">
<h3 class="mb10">Qualifications</h3>
<p><?php echo get_post_meta($doc->ID,'Qualifications',true); ?></p>
</div>
the bottom portion looks like this :
<?php $arg=array('post_type'=>'doctors','post_status'=>'publish','posts_per_page'=>4,'offset'=>1) ;
$doctor_data=get_posts($arg);
/*var_dump($doctor_data);*/ ?>
<div class="lightbg ptb80">
<div class="container">
<div class="row">
<div class="col-lg-12 col-md-12">
<h1 class="heading-title">Doctors</h1>
</div>
</div>
<div class="row">
<?php foreach($doctor_data as $doctor) { ?>
<div class="col-lg-3 col-md-3">
<div class="dc-style-box">
<img src="<?php echo get_the_post_thumbnail_url($doctor->ID); ?>" class="img-responsive" alt="Doctor 1" />
<div class="dc-style-inner">
<ul>
<li><i class="fa fa-facebook"></i></li>
<li><i class="fa fa-twitter"></i></li>
<li><i class="fa fa-google-plus"></i></li>
</ul>
<h5><?php echo $doctor->post_title; ?></h5>
<span><?php echo get_post_meta($doctor->ID,'Department',true);?></span>
</div>
</div>
</div>
can anyone shed some light to guide me ? ?
<?php
$cur = get_the_ID();
$arg=array('post_type'=>'doctors','post_status'=>'publish','posts_per_page'=>4,'offset'=>1, 'post__not_in' => $cur) ;
$doctor_data=get_posts($arg);
/*var_dump($doctor_data);*/ ?>
<div class="lightbg ptb80">
<div class="container">
<div class="row">
<div class="col-lg-12 col-md-12">
<h1 class="heading-title">Doctors</h1>
</div>
</div>
<div class="row">
<?php foreach($doctor_data as $doctor) { ?>
<div class="col-lg-3 col-md-3">
<div class="dc-style-box">
<img src="<?php echo get_the_post_thumbnail_url($doctor->ID); ?>" class="img-responsive" alt="Doctor 1" />
<div class="dc-style-inner">
<ul>
<li><i class="fa fa-facebook"></i></li>
<li><i class="fa fa-twitter"></i></li>
<li><i class="fa fa-google-plus"></i></li>
</ul>
<h5><?php echo $doctor->post_title; ?></h5>
<span><?php echo get_post_meta($doctor->ID,'Department',true);?></span>
</div>
</div>
</div>
Hi, You should add 'post__not_in' to exclude current post to be fetched in second loop. Try this code. Let me know if you need any more assistance.
Thanks.
According to your comment you wish to display random posts therefore use below $arg instead of yours.
$arg = array('post_type'=>'doctors',
'post_status'=>'publish',
'posts_per_page'=>4,
'offset'=>1,
'orderby' => 'rand'
);
I have a horizontal carousel that is working fine, here is the code for it
Now i wish to fetch the data from database and display it that corousel. Following is the code that i used
<div class='row'>
<div class='col-xs-12'>
<div class="carousel slide media-carousel" id="media">
<div class="carousel-inner">
<div class="item active">
<div class="row">
<?php foreach($student as $student): ?>
<div class="col-md-3">
<a class="thumbnail" href="#"><?php echo $student->fullname;?></a>
</div>
<?php endforeach; ?>
</div>
</div>
</div>
<a data-slide="prev" href="#media" class="left carousel-control">‹</a>
<a data-slide="next" href="#media" class="right carousel-control">›</a>
</div>
</div>
</div>
but the view is distorted and instead of all the slides sliding in one row, the view is coming like this
That's because unless the row is active, the other .item row gets the property display:none; If you were to remove the display:none; it should work as you want.
Create the class="row" inside the loop. Also keep in mind that the screen consists of 12 units only, so if you create a row of more than 12 units it will go to next line automatically. As you have created the loop that creates "col-md-3" for more than 4 times which sums more than 12, so it moves to next line.
For reference view this
As you have not given the php code, i am giving u sample of it
The array that you are getting divide it into a group of 4 (or as many as you want) like given below
$query = $this->db->get('student');
$r = $query->result();
$s = (array_chunk($r, 4));
return $s;
And then on the code you have given, change into following
<div class="carousel-inner">
<?php foreach($s as $key => $per_student): ?>
<?php if($key=='0'): ?>
<div class="item active">
<?php else: ?>
<div class="item ">
<?php endif; ?>
<div class="row">
<?php foreach($per_student as $student): ?>
<div class="col-md-3">
<a class="thumbnail" href="#"><?php echo $student->fullname;?></a>
</div>
<?php endforeach; ?>
</div>
</div>
<?php endforeach; ?>
</div>
i am using a main fours divs first div has class ad1, second and third div has class ad2 and then last div has class ad3...
i want to display 4 images from database
How to do it through while loop, please help, Thanks :)
here is html code and the php code....
<div class="col-md-9 hidden-sm hidden-xs">
<div class="col-md-1"></div>
<div class="col-md-2">
<div class="ad1">
<img src="" alt="">
</div>
</div>
<div class="col-md-2">
<div class="ad2">
<img src="" alt="">
</div>
</div>
<div class="col-md-2">
<div class="ad2">
<img src="" alt="">
</div>
</div>
<div class="col-md-5">
<div class="ad3">
<img src="" alt="">
</div>
</div>
</div>
php code is
<?php
$query = "SELECT * FROM headerimages limit 4";
$result = mysqli_query($con, $query) or die(mysqli_error($query));
while ($row = mysqli_fetch_array($result))
{?>
<?php
}
?>
First of all I recommend to use pdo database driver.
In your code the fast fix will be to assign result to array and simply echo it in the view.
$result = array();
while ($row = mysqli_fetch_array($result))
{
$result[]=$row['img'];
}
and in view echo it
<div class="col-md-9 hidden-sm hidden-xs">
<div class="col-md-1"></div>
<div class="col-md-2">
<div class="ad1">
<img src="<?=$result[0]?>" alt="">
</div>
</div>
<div class="col-md-2">
<div class="ad2">
<img src="<?=$result[1]?>" alt="">
</div>
</div>
<div class="col-md-2">
<div class="ad2">
<img src="<?=$result[2]?>" alt="">
</div>
</div>
<div class="col-md-5">
<div class="ad3">
<img src="<?=$result[3]?>" alt="">
</div>
</div>
</div>