i have trouble when open my web and its said Call to a member function result_array() on a non-object and i cant figure out how to solve it. i hope any of you guys can help me out.
so this is my web controller
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Web extends CI_Controller {
public function index(){
$data = array(
"produk_populers" => $this->mymodel->GetProduk()->result_array()
);
$comp = array(
"header" => $this->load->view("header",array(),true),
"navbar" => $this->load->view("navbar",array(),true),
"iklan" => $this->load->view("iklan",array(),true),
"produk_populer" => $this->load->view("produk_populer",$data,true),
"kategori" => $this->load->view("kategori",array(),true),
"footer" => $this->load->view("footer",array(),true),
);
$this->load->view("index",$comp);
}
public function html_produk_populer(){
$data = array(
"produk_populer" => $this->mymodel->GetProduk()
);
return $this->load->view("produk_populer",$data,true);
}
}
and this is my produk_populer.php
<div class="allcontain">
<div class="feturedsection">
<h1 class="text-center"><span class="bdots">•</span>P R O D U K<span class="carstxt">P O P U L E R</span>•</h1>
</div>
<div class="feturedimage">
<div class="row firstrow">
<div class="col-lg-6 costumcol colborder1">
<div class="row costumrow">
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 img1colon">
<img src="<?php echo base_url()."assets/"; ?>images/<?php echo $produk_populer['gambar_produk']; ?>" alt="floridina">
</div>
<?php foreach ($produk_populers as $produk_populer) { ?>
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 txt1colon">
<div class="featurecontant">
<h1><?php echo $produk_populer['nama_produk']; ?></h1>
<p><?php echo $produk_populer['info_produk']; ?></p>
<h1><?php echo $produk_populer['harga_produk']; ?></h1>
<!--<<button id="btnRM" onClick="rmtxt()">READ MORE</button>
<div id="readmore">
<h1></h1>
<p><br>
sed do eiusmod tempor incididunt <br>"Lorem ipsum dolor sit amet, consectetur ,<br>
sed do eiusmod tempor incididunt"Lorem ipsum dolor sit amet, consectetur1 ,
sed do eiusmod tempor incididunt"Lorem ipsum dolor sit amet, consectetur1
sed do eiusmod tempor incididunt"Lorem ipsum dolor sit amet, consectetur1<br>
</p>
<button id="btnRL">READ LESS</button>
</div>-->
</div>
</div>
<?php } ?>
</div>
</div>
<!--<div class="col-lg-6 costumcol colborder2">
<div class="row costumrow">
<?php //foreach ($produk_populers as $produk_populer) { ?>
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 img2colon">
<img src="<?php //echo base_url()."assets/"; ?>images/<?php //echo $produk_populer['gambar_produk']; ?>" alt="floridina">
</div>
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 txt1colon ">
<div class="featurecontant">
<h1><?php //echo $produk_populer['nama_produk']; ?></h1>
<p><?php //echo $produk_populer['info_produk']; ?></p>
<h1><?php //echo $produk_populer['harga_produk']; ?></h1>
<div id="readmore">
<h1></h1>
<p><br>
sed do eiusmod tempor incididunt <br>"Lorem ipsum dolor sit amet, consectetur ,<br>
sed do eiusmod tempor incididunt"Lorem ipsum dolor sit amet, consectetur1 ,
sed do eiusmod tempor incididunt"Lorem ipsum dolor sit amet, consectetur1
sed do eiusmod tempor incididunt"Lorem ipsum dolor sit amet, consectetur1<br>
</p>
<button id="btnRL">READ LESS</button>
</div>
</div>
</div>
<?php } ?>
</div> -->
</div>
</div>
</div>
also this is mymodel.php
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Mymodel extends CI_Model {
public function GetProduk($where=""){
$data = $this->db->query('select * from produk');
return $data -> result_array();
}
}
so that is all i need to ask, i hope theres anyone who can help me. Thanks
Following should work assuming you have loaded DB class.
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Mymodel extends CI_Model {
public function GetProduk($where=""){
$data = $this->db->query('select * from produk');
return $data;
}
}
$this->mymodel->GetProduk()->result_array();
$this->mymodel is not working. You didn't load model. You have to load mymodel before call it by using $this->load->model('mymodel'). Or also you can load it from globally by using autoload.php
Related
The html inside the main tag is not displaying but when I inspect the code, the html is there. This happens after I added the get_header function which gets a new header that is only for the front-page (other pages will get the normal header). The header and the footer are displaying without issues, only some listed items in the hero section aren't displaying either. I'm new to Wordpress and PHP, what is the best way to fix this?
My header-new.php code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>Title</title>
<meta content="" name="description">
<meta content="" name="keywords">
<!-- Favicons -->
<link href="assets/img/favicon.png" rel="icon">
<link href="assets/img/apple-touch-icon.png" rel="apple-touch-icon">
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Montserrat:300,300i,400,400i,500,500i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i" rel="stylesheet">
<?php wp_head();?>
</head>
<body>
<!-- ======= Hero Section ======= -->
<section id="hero">
<div class="hero-container">
<img src ="<?php bloginfo('template_directory');?>/assets/img/light-logo.png" alt="Logo" class="img-fluid hero-logo" data-aos="zoom-in">
<ul data-aos="fade-up">
<li>Listed Item 1</li>
<li>Listed Item 2</li>
<li>Listed Item 3</li>
<li>Listed Item 4</li>
</ul>
<a data-aos="fade-up" href="#about" class="btn-get-started scrollto">Learn More</a>
</div>
</section><!-- End Hero -->
<!-- ======= Header ======= -->
<header id="header" class="d-flex align-items-center">
<div id="navbar-container">
<div class="logo d-block d-lg-none">
<img src="<?php bloginfo('template_directory');?>/assets/img/dark-logo.png" alt="Maite Richert Logo" class="img-fluid">
</div>
<nav class="nav-menu d-none d-lg-block">
<ul class="nav-inner">
<li class="active">Meet Me</li>
<li class="drop-down">Programs
<ul>
<li>One-to-one Coaching</li>
<li>Posing Lessons</li>
</ul>
</li>
<li class="nav-logo"><img src="<?php bloginfo('template_directory');?>/assets/img/dark-logo.png" alt="Logo" class="img-fluid logo-image"></li>
<li>Shop</li>
<li>Contact</li>
</ul>
</nav><!-- .nav-menu -->
</div>
</header><!-- End Header -->
<main id="main">
My footer.php code:
</main><!-- End #main -->
<!-- ======= Footer ======= -->
<footer id="footer">
<div class="footer-top">
<div class="container">
<div class="social-links">
<img src="<?php bloginfo('template_directory');?>/assets/img/tiktok.png" alt="TikTok Icon" class="tiktok">
<i class="bx bxl-instagram"></i>
<i class='bx bxl-youtube'></i></i>
</div>
</div>
</div>
<div class="container footer-bottom clearfix">
<div class="copyright">
© <strong><span>Maite Richert</span></strong>. All Rights Reserved. 2020
</div>
</div>
</footer><!-- End Footer -->
<i class="icofont-simple-up"></i>
<?php wp_footer();?>
</body>
</html>
And my front-page.php code:
<!-- ======= About Us Section ======= -->
<section id="about" class="about">
<div class="container">
<div class="section-title" data-aos="fade-up">
<h2>Meet Me</h2>
</div>
<div class="row">
<div class="col-lg-6" data-aos="fade-right">
<div class="image">
<img src="<?php bloginfo('template_directory');?>/assets/img/maite.jpg" class="img-fluid" alt="Fitness Coach">
</div>
</div>
<div class="col-lg-6" data-aos="fade-left">
<div class="content pt-4 pt-lg-0 pl-0 pl-lg-3 ">
<h3>Hi, I'm Maite</h3>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<ul>
<li><i class="bx bx-check"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>
<li><i class="bx bx-check"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>
<li><i class="bx bx-check"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>
<li><i class="bx bx-check"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>
<li><i class="bx bx-check"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>
</ul>
</div>
</div>
</div>
</div>
</section><!-- End About Us Section -->
<!-- ======= Services Section ======= -->
<section id="services" class="services">
<div class="container">
<div class="section-title" data-aos="fade-up">
<h2>Programs</h2>
</div>
<div class="row" style="margin-bottom: 10vh;">
<div class="col-lg-6 order-2 order-lg-1 services-box">
<div class="icon-box mt-5 mt-lg-0" data-aos="fade-up">
<i class="icofont-muscle-weight"></i>
<h4>One-to-one coaching</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
<div class="learn-more-btn">Learn More</div>
</div>
<div class="icon-box mt-5" data-aos="fade-up" data-aos-delay="100">
<i class="icofont-trophy"></i>
<h4>Posing Coach</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
<div class="learn-more-btn">Learn More</div>
</div>
</div>
<div class="col-lg-6 order-1 order-lg-2" data-aos="fade-left" data-aos-delay="100"><img class="img-fluid" src="<?php bloginfo('template_directory');?>/assets/img/services.jpg" alt="Fitnees posing"></div>
</div>
</div>
</section><!-- End Services Section -->
<!-- ======= Why Us Section ======= -->
<section id="why-us" class="why-us">
<div class="container">
<div class="row">
<div class="col-lg-12 order-2 order-lg-1 d-flex flex-column justify-content-center align-items-stretch">
<div class="content" data-aos="fade-up">
<h3><b>Why should you choose me?</b></h3>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</p>
<h4>How can you help you?</h4>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</p>
<h4>Will this work for you?</h4>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</p>
<h4>Aren't all the personal trainers the same?</h4>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>
</div>
</div>
</div>
</section><!-- End Why Us Section -->
<!-- ======= Sponsors Section ======= -->
<section id="sponsors" class="sponsors">
<div class="container">
<h3>Sponsors</h3>
<div class="row sponsor-img-container">
<div class="col-lg-2 col-md-4 col-6" data-aos="zoom-in" data-aos-delay="400">
<img src="<?php bloginfo('template_directory');?>/assets/img/sponsors/sponsor-5-1.png" id="womens-best" class="img-fluid" alt="Women's Best">
</div>
<div class="col-lg-2 col-md-4 col-6" data-aos="zoom-in" data-aos-delay="500">
<img src="<?php bloginfo('template_directory');?>/assets/img/sponsors/sponsor-6.png" class="img-fluid" alt="Ryderwear">
</div>
<div class="col-lg-2 col-md-4 col-6" data-aos="zoom-in" data-aos-delay="300">
<img src="<?php bloginfo('template_directory');?>/assets/img/sponsors/sponsor-4-1.png" id="wbff" class="img-fluid" alt="WBFF">
</div>
<div class="col-lg-2 col-md-4 col-6" data-aos="zoom-in" data-aos-delay="100">
<img src="<?php bloginfo('template_directory');?>/assets/img/sponsors/sponsor-2.png" class="img-fluid" alt="FitGriff">
</div>
<div class="col-lg-2 col-md-4 col-6" data-aos="zoom-in" data-aos-delay="200">
<img src="<?php bloginfo('template_directory');?>/assets/img/sponsors/sponsor-3-1.png" id="f4" class="img-fluid" alt="Factory 4">
</div>
<div class="col-lg-2 col-md-4 col-6" data-aos="zoom-in">
<img src="<?php bloginfo('template_directory');?>/assets/img/sponsors/sponsor-1.png" class="img-fluid" alt="Basic Fit">
</div>
</div>
</div>
</section><!-- End Sponsors Section -->
<!-- ======= Contact Section ======= -->
<section id="contact" class="contact section-bg">
<div class="container">
<div class="section-title">
<h2>Contact</h2>
<p>If you are interested in my services or if you have any questions, don't hesitate to contact me!</p>
</div>
<div class="row">
<div class="col-lg-8 mt-5 mt-lg-0 form-box">
<form action="forms/contact.php" method="post" role="form" class="php-email-form" data-aos="fade-left">
<div class="form-row">
<div class="col-md-6 form-group">
<input type="text" name="name" class="form-control" id="name" placeholder="Your Name" data-rule="minlen:4" data-msg="Please enter at least 4 chars" />
<div class="validate"></div>
<p>So I can get to know you better.</p>
</div>
<div class="col-md-6 form-group">
<input type="email" class="form-control" name="email" id="email" placeholder="Your Email" data-rule="email" data-msg="Please enter a valid email" />
<div class="validate"></div>
<p>Only to reply you back. No marketing.</p>
</div>
</div>
<div class="form-group" style="padding-bottom: 2rem;">
<input type="text" class="form-control" name="subject" id="subject" placeholder="Subject" data-rule="minlen:4" data-msg="Please enter at least 8 chars of subject" />
<div class="validate"></div>
</div>
<div class="form-group">
<textarea class="form-control" name="message" rows="5" data-rule="required" data-msg="Please write something for us" placeholder="Message"></textarea>
<div class="validate"></div>
</div>
<div class="mb-3">
<div class="loading">Loading</div>
<div class="error-message"></div>
<div class="sent-message">Your message has been sent. Thank you!</div>
</div>
<div class="text-center form-btn-container"><button type="submit">Send Message</button></div>
</form>
</div>
</div>
</div>
</section><!-- End Contact Section -->
<?php get_footer();?>
This is not a direct answer to your question, but it may solve your problem, so I hope the answer is helpful for you.
If you only want to add a hero section to your front page, I think you do not need a page template and header template only for this one case. You could add a if clause inside of your default header.php checking if you are on frontpage. If it is true, your hero section is being inserted:
<body>
<?php if (is_front_page()) { ?>
<!-- ======= Hero Section ======= -->
<section id="hero">
<div class="hero-container">
<img src ="<?php bloginfo('template_directory');?>/assets/img/light-logo.png" alt="Logo" class="img-fluid hero-logo" data-aos="zoom-in">
<ul data-aos="fade-up">
<li>Listed Item 1</li>
<li>Listed Item 2</li>
<li>Listed Item 3</li>
<li>Listed Item 4</li>
</ul>
<a data-aos="fade-up" href="#about" class="btn-get-started scrollto">Learn More</a>
</div>
</section><!-- End Hero -->
<?php } ?>
.
.
.
This would be my solution. Does it work for you? If not, try chaning the content of your hero-container to check if something is wrong with this code. Just add a <p>test</p> to see that the if clause is working and that only the frontpage is outputting the paragraph with "test".
If you want to have a different page template (maybe because there are more pages you want to show the hero section), make sure you use the right file names to make wordpress template hierarchy work: https://developer.wordpress.org/themes/basics/template-hierarchy/
Page Template can be created with copying the page.php, renaming it page-frontpage.php and adding /* Template Name: Frontpage */ at the top of it. Go to your wordpress backend and edit your frontpage. On the right side under "page attributes" select the created page template.
Inside of your page-frontpage.php change the get_header() function to:
get_header('frontpage');
Then create a copy of your header.php and name it "header-frontpage.php".
Now every page that has the "frontpage" page template, will use the header with the name "frontpage". In the header-frontpage.php you make your changes.
For me a template only makes sense, if it is applied to more pages. For one case, you can do more easy and faster using an if clause.
Hope this can help you.
i'm trying to fetch the result from database with php mysqli function where by i can successfully fetch all the result, but it all show in a same row. How to make them to separate the row after display 4 result?
Let say i have total of 8 result in database. So if i'm using while loop to fetch the data and echo it it should be something like this:
data1 data2 data3 data4 data5 data6 data7 data8
But how to make it to show display like this :
data1 data2 data3 data4
data5 data6 data7 data8
This is the sample hardcoded div result:
<div class="row">
<div id="portofolio">
<!-- Project 1-->
<div class="three columns category trains">
<h5>Sponsor 1</h5>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
<div class="portofoliothumb">
<img src="images/temp/logo1.jpg" class="fourimage" alt=""/>
</div>
</div>
<!-- Project 2-->
<div class="three columns category castles">
<h5>Sponsor 2</h5>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
<div class="portofoliothumb">
<img src="images/temp/logo2.jpg" class="fourimage" alt=""/>
</div>
</div>
<!-- Project 3-->
<div class="three columns category nature">
<h5>Sponsor 3</h5>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
<div class="portofoliothumb">
<img src="images/temp/logo7.jpg" class="fourimage" alt=""/>
</div>
</div>
<!-- Project 4-->
<div class="three columns category castles">
<h5>Sponsor 4</h5>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
<div class="portofoliothumb">
<img src="images/temp/logo3.jpg" class="fourimage" alt=""/>
</div>
</div>
<!-- Project 5--><!-- Project 6--><!-- Project 7-->
<!-- Project 8-->
</div>
</div>
<div class="row">
<div id="portofolio">
<!-- Project 1-->
<div class="three columns category trains">
<h5>Sponsor 5</h5>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
<div class="portofoliothumb">
<img src="images/temp/logo4.jpg" class="fourimage" alt=""/>
</div>
</div>
<!-- Project 2-->
<div class="three columns category castles">
<h5>Sponsor 6</h5>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
<div class="portofoliothumb">
<img src="images/temp/logo5.jpg" class="fourimage" alt=""/>
</div>
</div>
<!-- Project 3-->
<div class="three columns category nature">
<h5>Sponsor 7</h5>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
<div class="portofoliothumb">
<img src="images/temp/logo8.jpg" class="fourimage" alt=""/>
</div>
</div>
<!-- Project 4-->
<div class="three columns category castles">
<h5>Sponsor 8</h5>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
<div class="portofoliothumb">
<img src="images/temp/logo6.jpg" class="fourimage" alt=""/>
</div>
</div>
<!-- Project 5--><!-- Project 6--><!-- Project 7-->
<!-- Project 8-->
</div>
</div>
Here is the php code that i'm going to display the result but i had no clue how to separate the result with 4 and go to next line and display.
PHP Code here:
<?php
include 'dbConnection.php';
global $dbLink;
$image = "SELECT * FROM sponsor_item where sponsor_data !='' ";
$result=mysqli_query($dbLink,$image);
// Numeric array
while($row=mysqli_fetch_array($result,MYSQLI_ASSOC)){
?>
<div class="row">
<div id="portofolio">
<!-- Project 1-->
<div class="three columns category trains">
<h5>Sponsor 1</h5>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
<div class="portofoliothumb">
<img style="margin-left: 0px; margin-top: -218.375px; width: 100%; height: 1150px;" src="data:image/jpeg;base64,<?php echo base64_encode($row['sponsor_data']); ?>" alt="image0<?php echo $row['sponsor_item_id']; ?>">
</div>
</div>
</div>
<?php
}
mysqli_free_result($result);
// Close the mysql connection
$dbLink->close();
?>
You need to add a counter and look when the counter value is a multiple of 4. If it's the case, just echo the the DIV end tag and a new DIVstart tag. You also need to exclude the first and last DIV tags from the WHILE loop :
<?php
include 'dbConnection.php';
global $dbLink;
$image = "SELECT * FROM sponsor_item where sponsor_data !='' ";
$result=mysqli_query($dbLink,$image);
$item = 0;
?>
<div class="row">
<div id="portofolio">
<?php
// Numeric array
while($row=mysqli_fetch_array($result,MYSQLI_ASSOC)){
?>
<!-- Project 1-->
<div class="three columns category trains">
<h5>Sponsor 1</h5>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
<div class="portofoliothumb">
<img style="margin-left: 0px; margin-top: -218.375px; width: 100%; height: 1150px;" src="data:image/jpeg;base64,<?php echo base64_encode($row['sponsor_data']); ?>" alt="image0<?php echo $row['sponsor_item_id']; ?>">
</div>
</div>
<?php
$item++;
if ($item % 4 == 0) { echo '</div></div><div class="row"><div id="portofolio">'; }
}
mysqli_free_result($result);
// Close the mysql connection
$dbLink->close();
?>
</div>
</div>
Count how many rows you've printed, then use that to insert a row after however many rows
$counter = 0;
foreach($result as....)
{
print $result->whatever;
$counter++;
if($counter % 4 == 0) // Counter divides cleanly by 4
{
print "<br />";
//Or whatever goes between your rows, eg </div><div class="whatever">
}
}
To do this, use the modulus operator, %. This gives the remainder of dividing the first number by the second, so gives an answer of 0 if the number cleanly divides
eg
1 % 4 = 1 // No new line
2 % 4 = 2 // No new line
3 % 4 = 3 // No new line
4 % 4 = 0 // New line!
5 % 4 = 1 // No new line
Use
<?php
$counter=1;
while($row=mysqli_fetch_array($result,MYSQLI_ASSOC)){
{
if($counter%4==0)
{
?>
<div class="row">
<div id="portofolio">
<?php
}
?>
<!--Your Regular repeating DIVS start here-->
<div class="three columns category trains">
<h5>Sponsor 1</h5>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
<div class="portofoliothumb">
<img style="margin-left: 0px; margin-top: -218.375px; width: 100%; height: 1150px;" src="data:image/jpeg;base64,<?php echo base64_encode($row['sponsor_data']); ?>" alt="image0<?php echo $row['sponsor_item_id']; ?>">
</div>
</div>
<!--Your Regular repeating DIVS end here-->
<?php
if($counter%4==0)
{
?>
</div>
</div>
<?php
}
$count+=1;
}
?>
I am trying to converting this line of hard coded images into a dynamic code by using mysql to retrieve it.
<div class="item-block-1">
<span class="tag-sale"></span>
<div class="image-wrapper">
<div class="image">
<div class="overlay">
<div class="position">
<div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam quis metus non erat tincidunt consectetur. Maecenas ac turpis id lorem.</p>
Quick shop
</div>
</div>
</div>
<img src="images/photos/photo-3.jpg" style="margin: -32.5px 0 0 0;" alt="" />
</div>
</div>
<h2>Polka dot light blue blouse</h2>
<p class="price">$13.99<s>$36.99</s></p>
</div>
My dynamic code is as follow but it only allows me to retrieve only one image instead of looping through the codes..
<div class="item-block-1">
<div class="image-wrapper">
<div class="image">
<div class="overlay">
<div class="position">
<div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam quis metus non erat tincidunt consectetur. Maecenas ac turpis id lorem.</p>
Quick shop
</div>
</div>
</div>
<?php
$result = mysql_query("SELECT * FROM my_image", $connection);
while($row = mysql_fetch_array($result))
{
echo "<div><img src=\"uploadedimages/".$row['name']."\" /></div>";
}
?>
</div>
</div>
Can anyone correct me ?
Try this code
<?php
$result = mysql_query("SELECT * FROM my_image");
?>
<div class="item-block-1">
<div class="image-wrapper">
<div class="image">
<div class="overlay">
<div class="position">
<div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam quis metus non erat tincidunt consectetur. Maecenas ac turpis id lorem.</p>
Quick shop
</div>
</div>
</div>
<?php
while($row = mysql_fetch_array($result))
{
?>
<div>
<img src="new/<?php echo $row['name']; ?>"/>
</div>
<?php
}
?>
</div>
</div>
</div>
Since you're up for suggestions
<?php
/*
* I usually put this in a class, but doing this all in-line for you.
* I did this with PDO, which is just like mysql_, but better.
*/
$db_name = ''; // put your database name here
$db_host = ''; // your host name, usually localhost
$db_username = ''; // the database username used to access this database
$db_password = ''; // password associated with the username
$dsn = 'mysql:dbname='.$db_name.';host='.$db_host; // this is for the PDO object
$PDO = new PDO($dsn, $db_username, $db_password);
$query = 'SELECT * FROM my_image';
$Stmt = $PDO->prepare($query); // prepares your SQL
$Stmt->execute() // runs your SQL
// This will test to see if you get any images back from your database
if ($Stmt->rowCount() > 0) {
/*
* This means you have atleast 1 image back from your database
* The wile loop will iterate through your images from the database
* and generate the HTML below for each, only changing the name of the file
* on each iteration
*/
while ($row = $Stmt->fetch(PDO::FETCH_ASSOC)) {
echo '<div class="item-block-1">';
echo '<div class="image-wrapper">';
echo '<div class="image">';
echo '<div class="overlay">';
echo '<div class="position">';
echo '<div>';
echo '<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam quis metus non erat tincidunt consectetur. Maecenas ac turpis id lorem.</p>';
echo 'Quick shop';
echo '</div>';
echo '</div>'; // class="position" div
echo '</div>'; // class="overlay" div
echo '<div><img src="uploadedimages/'.$row['name'].'" /></div>'; // This is the actual image
echo '</div>'; // class="image" div
echo '</div>'; // class="image-wrapper" div
echo '</div>'; // class="image-block-1" div
}
}
Of course this is not how to properly do this, but if you were to do it in-line like this, it would be this way. the while loop will generate the SAME html for every image, except for the image file path, which changes depending on the current row your in in the while loop.
Basically I need a custom Wordpress post loop which outputs posts in the following format (it should be formatted that way for every two posts, so two posts each in a "col" div both contained in the "row" div.):
<div class="row cols2">
<div class="col left">
<img src="featured-image.jpg" />
<h2>Blog Post Title</h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
</div><!-- /.col left -->
<div class="col right">
<img src="featured-image.jpg" />
<h2>Blog Post Title</h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
</div><!-- /.col right -->
</div><!-- /.row cols2 -->
I have more or less achieved this using the following loop:
<?php $counter=1;$grids=2;global $query_string;query_posts($query_string.'&caller_get_posts=1&posts_per_page=6');if(have_posts()):while(have_posts()):the_post();if($counter==1):?>
<div class="row cols2">
<div class="col left">
<?php the_post_thumbnail('default-thumb')?>
<h2><?php the_title(); ?></h2>
<?php the_excerpt() ?>
</div><!-- /.col left -->
<?php elseif($counter==$grids):?>
<div class="col right">
<?php the_post_thumbnail('default-thumb')?>
<h2><?php the_title(); ?></h2>
<?php the_excerpt() ?>
</div><!-- /.col right -->
</div><!-- /.row cols2 -->
<?php $counter=0;endif;$counter++;endwhile;endif;?>
The only problem with this is when there is only one post in the ".row cols2" div it messes up because the ".row cols2" closing tag is only outputted when there are two posts in a row. If anyone has any idea on how to help it would be GREATLY appreciated!
I'm so glad i dont have to work with your code, it's a nightmare to read. I would recommend not bunching up conditions and loops like that, it just makes reading and debugging so much more difficult.
On to your question, the basic idea is that you output the container every even count increment, then check the counter at the end to find if your missing any requirements (i.e. table cells in a table, an ending tag for an element e.c.t.).
So all you need to do is check it at the end (i've also rewritten your post output, never duplicate the same code unnecessarily, it could cause you issues later on when you make changes to one and not the other).
<?php
$counter=1;
$grids=2;
global $query_string;
query_posts($query_string.'&caller_get_posts=1&posts_per_page=6');
if(have_posts()):
while(have_posts()):
the_post();
//-- ouput start elements
if($counter==1): ?>
<div class="row cols2">
<div class="col left">
<?php
elseif($counter == $grids): ?>
<div class="col right">
<?php endif; ?>
<?php /* Output column box content */ ?>
<?php the_post_thumbnail('default-thumb')?>
<h2><?php the_title(); ?></h2>
<?php the_excerpt() ?>
<?php /* always need to close the inner div */ ?>
</div>
<?php
//-- if its the second column, then end row and reset counter
if($counter == $grids): ?>
</div>
<?php
$counter = 0;
endif; ?>
<?php
$counter++;
endwhile;
if($counter == 1):
//--- output empty second column div then end the row
?>
<div class="col right"></div>
</div>
<?php
endif;
?>
<?php
/** Forgot this one */
endif;
?>
Finally got it working correctly, based off Lee's code, really appreciate the help! The code:
<?php $counter=1;global $query_string;query_posts($query_string.'&caller_get_posts=1&posts_per_page=6');if(have_posts()):while(have_posts()):the_post();if($counter==1):?>
<div class="row cols2">
<div class="col"><?php elseif($counter==2): ?><div class="col"><?php endif; ?>
<?php the_post_thumbnail('default-thumb')?>
<h2><?php the_title(); ?></h2>
<?php the_excerpt() ?>
</div><!-- /.col -->
<?php if($counter==2): ?></div><!-- /.row cols2 -->
<?php $counter=0;endif;$counter++;endwhile;if($counter==2):?></div><!-- /.row cols2 --><?php endif;endif; ?>
I am using jquery ui's tabs
And i want to make it dynamic by getting the tabs from a mysql database using php , but not sure how to add the fragment 1 , 2 , 3 according to the number of rows of the table i have.
For example , there's 5 rows , that means there's 5 fragment. here's the html code for the jquery ui.
<div id="featured" >
<ul class="ui-tabs-nav">
<li class="ui-tabs-nav-item ui-tabs-selected" id="nav-fragment-1"><img class="thumb" src="http://upload.wikimedia.org/wikipedia/en/thumb/0/0f/Avs38.jpg/250px-Avs38.jpg" alt="" /><span>15+ Excellent High Speed Photographs</span></li>
<li class="ui-tabs-nav-item" id="nav-fragment-2"><img class="thumb" src="http://www.crunchbase.com/assets/images/original/0007/5132/75132v1.jpg" alt="" /><span>20 Beautiful Long Exposure Photographs</span></li>
</ul>
<!-- First Content -->
<div id="fragment-1" class="ui-tabs-panel" style="">
<img src="image.jpg" alt="" />
<div class="info" >
<h2><a href="#" >Loerm Ipsum</a></h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla tincidunt condimentum lacus. Pellentesque ut diam....<a href="#" >read more</a></p>
</div>
</div>
</div>
Normally i would use this php code to echo out database
<?php
$rows = array();
while($row = mysql_fetch_array( $query )){
$rows[] = $row;
echo "'Some html code data $row[image] test'\n";
}
}
?>
However if i use this code , it will generate a html like :
<div id="fragment-1" class="ui-tabs-panel" style="">
<img src="image.jpg" alt="" />
<div class="info" >
<h2><a href="#" >Loerm Ipsum</a></h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla tincidunt condimentum lacus. Pellentesque ut diam....<a href="#" >read more</a></p>
</div>
</div>
<div id="fragment-1" class="ui-tabs-panel" style="">
<img src="image2.jpg" alt="" />
<div class="info" >
<h2><a href="#" >Loerm Ipsum2</a></h2>
<p>L2222<a href="#" >read more</a></p>
</div>
</div>
As you can see , it does not make the second fragment , fragment TWO.
I want the results to be like this:
<div id="fragment-1" class="ui-tabs-panel" style="">
<img src="image.jpg" alt="" />
<div class="info" >
<h2><a href="#" >Loerm Ipsum</a></h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla tincidunt condimentum lacus. Pellentesque ut diam....<a href="#" >read more</a></p>
</div>
</div>
<div id="fragment-2" class="ui-tabs-panel" style="">
<img src="image2.jpg" alt="" />
<div class="info" >
<h2><a href="#" >Loerm Ipsum2</a></h2>
<p>L2222<a href="#" >read more</a></p>
</div>
</div>
So how can i do this?
<?php
$rows = array();
$frag = 1;
while($row = mysql_fetch_array( $query )){
$rows[] = $row;
echo "fragment-$frag";
echo "'Some html code data $row[image] test'\n";
$frag++;
}
}
?>
If you are talking about initial loading of the tabs, then modify your code to have a counter, and output the value of that counter to the tab fragment as follows:
<?php
$count = 0; // Initialize counter
$rows = array();
while($row = mysql_fetch_array( $query )) {
$rows[] = $row;
echo '<div id="fragment-' . ++$count . '" class="ui-tabs-panel" style="">';
echo "'Some html code data $row[image] test'\n";
}
?>