how to set html layout in loop - php

I want to set a html layout view in a loop for multiple categories. My html code is here...there were many of categories came from (wp-admin) woocommerce. Given code is layout of how to show my categories in home.php so i want to add more categories in home.php through loop.Thanks
My html code is So far...
<div class="selected-products-wrapper clearfix">
<div class="category-list">
<span class="category-main" style="background-color: #5D973E">
<div class="category-main_logo">
<img src="" alt="" class="v-middle"></div>
<span class="category-main-title">
<a href="<?php
echo get_term_link($cat->slug, 'product_cat');
?>">
<?php echo $cat->name; ?></a></span>
<div class="category-main-yakataheader"><img src=""></div>
</span>
<ul class="sub-category-list">
<li><?php echo $sub_category ->name; ?></li>
</ul>
View all
</div>
<div class="images-list">
<a href="" class="large-img">
<img src="" alt="Confectionery"
class="v-middle lazy-img" height="351" width="290">
</a>
<span class="small-img-block">
<a href="">
<img src="" alt="Fruits & Veggies"
class="v-middle lazy-img" height="175" width="171">
</a>
<a href="">
<img src="" alt="Noodles"
class="v-middle lazy-img" height="175" width="171">
</a>
</span>
<span class="center_img-block">
<a href="">
<img src="" alt="Oats"
class="v-middle lazy-img" height="175" width="344">
</a>
<a href="">
<img src="" alt="Ofada"
class="v-middle lazy-img" height="175" width="344">
</a>
</span>
<span class="small-img-block last-img-block">
<a href="">
<img src="" alt="Cooking Oils"
class="v-middle lazy-img" height="175" width="171">
</a>
<a href="">
<img src="" alt="Seasoning"
class="v-middle lazy-img" height="175" width="171">
</a>
</span>
</div>
<div class="alt-images-block">
Fruits & Veggies
Noodles
Cooking Oils
Seasoning
</div>
</div>

you need to create a custom php function with the data you want repeat.
e.g.
<?php
function repeat_category(){ ?>
//your html code you want to repeat goes here.
<?php } ?>
Then you can just use
<?php
repeat_category();
?>
Wherever you want your html code to appear.

Related

How to query item 1 categories show 3 <div class="item">

It might be a little difficult to explain.
I want it to display the data in html format below from same category
The display will be like the preview. 1 category will display 3 items, amount 3
database
<div class="gallery lapps-main">
<div class="gallery_scroller no-scrollbar">
<div class="item">
<a class="lapp" href="" title="">
<figure><img src="" width="56" height="56" data-src="" class="lzl" alt="icon"></figure>
<p class="info">
<span class="name">1</span>
<span class="author">1</span>
</p>
</a>
<div class="item">
<a class="lapp" href="" title="">
<figure><img src="" width="56" height="56" data-src="" class="lzl" alt="icon"></figure>
<p class="info">
<span class="name">1</span>
<span class="author">1</span>
</p>
</a>
</div>
<div class="item">
<a class="lapp" href="" title="">
<figure><img src="" width="56" height="56" data-src="" class="lzl" alt="icon"></figure>
<p class="info">
<span class="name">1</span>
<span class="author">1</span>
</p>
</a>
</div>
<span class="gallery_btn prev"></span>
<span class="gallery_btn next"></span>
</div>

WP custom post type loop using ACF not showing in category pages footer

I have a custom post type "suppliers" who's sole purpose is to display a series of supplier logos in the footer. This works fine on every page except the category pages?
It uses the advanced custom fields plugin for a logo and the suppliers url.
My code is:
<?php $suppliers_loop = new WP_Query( array( 'post_type' => 'suppliers', 'posts_per_page' => 7 ) ); ?>
<?php if ($suppliers_loop->have_posts()): while ( $suppliers_loop->have_posts() ) : $suppliers_loop->the_post();
$image = get_field('image');?>
<a href="<?php echo(get_field('suppliers_url'))?>">
<img src="<?php echo $image['url'];?>" title="<?php echo $image['title'];?>" alt="<?php echo $image['alt'];?>"/>
</a>
<?php endwhile; endif; ?>
Which is outputting:
<a href="">
<img src="" title="" alt=""/>
</a>
<a href="">
<img src="" title="" alt=""/>
</a>
<a href="">
<img src="" title="" alt=""/>
</a>
<a href="">
<img src="" title="" alt=""/>
</a>
<a href="">
<img src="" title="" alt=""/>
</a>
<a href="">
<img src="" title="" alt=""/>
</a>
<a href="">
<img src="" title="" alt=""/>
</a>
So it's looping but just not displaying the content?

DOM scripting getElementsByID -- links

I'm learning php and DOM. And i have issue. So, I am trying to improve and understand the following. I have some links with ID div and I am attaching event on them:
<div id='articleList1' >
<div class="hotOne">
<a class="" href="http://link1/index.html" >
<span class="itemTitle">
1 title
</span>
<img src="1.jpg" class=""
alt="1"
title="1"
border="0"
/>
</a>
</div>
<div class="hotThree">
<ul>
<li class="item item1 ">
<a href="http://link2/index.html" title="2" >
<span class="itemTitle">
2 title
</span> <img src="2.jpg" class=""
alt="2"
title="2"
border="0"
/> <p> 2 tekst </span> </p> </a>
</li>
<li class="item item2 ">
<a href="http://link3.html" title="3" >
<span class="itemTitle">
3 title
</span> <img src="3.jpg" class=""
alt="3"
title="3"
border="0"
/> <p> 3 tekst </span> </p> </a>
</li>
</div>
<?php $div1 = $dom->getElementById('articleList1');
$href = $div1->getElementsByTagName('a');
foreach ($href as $hrefs) {
$link = $hrefs->getAttribute('href');
}
echo '<a href ="'.$link.'">'.$link.'<br>'); ?>
However, this script does not work. And I don't know why it's not work?.
Thx for all answers.
Your HTML markup is pretty poor - there are mistakes creeping in which will not help working with the DOM.
<div id='articleList1' >
<div class="hotOne">
<a class="" href="http://link1/index.html" >
<span class="itemTitle">1 title</span>
<img src="1.jpg" class="" alt="1" title="1" border="0" />
</a>
</div>
<div class="hotThree">
<ul>
<li class="item item1 ">
<a href="http://link2/index.html" title="2" >
<span class="itemTitle">2 title</span>
<img src="2.jpg" class="" alt="2" title="2" border="0" />
<p>2 tekst</p><!-- <~~~ error here previously -->
</a>
</li>
<li class="item item2 ">
<a href="http://link3.html" title="3" >
<span class="itemTitle">3 title</span>
<img src="3.jpg" class="" alt="3" title="3" border="0" />
<p>3 tekst</p><!-- <~~~ error here previously -->
</a>
</li>
</ul><!-- missing -->
</div>
</div><!-- missing -->
<?php
$col=$dom->getElementsByTagName('a');
foreach( $col as $node ){
if( $node->nodeType===XML_ELEMENT_NODE && $node->hasAttribute('href') ){
echo $node->getAttribute('href');
}
}
?>
in iteration over $hrefs - refer to dingle href instead of list:
foreach ($href as $hrefs) {
$link = $href->getAttribute('href'); //not $hrefs->
}

How to make dynamic slideshow using php, mysql, css and html?

I wanna make dynamic slideshow with css and HTML. Image will be took by id from tb_image.
id int
image_name varchar (100)
image_path (100)
How to make dynamic slideshow using php, mysql, css and html?
or Can get image by id?
include "connnection.php";
$result = mysql_query("select * from slider");
?>
<div class="accordian">
<?php
$i=1;
while($row = mysql_fetch_array($result)){
?>
<ul>
<li>
<div class="image_title">
</div>
<a href="#">
<img src="../img/<?php echo $i;?>.jpg" alt="" width="640" border="320"/> //I tried use this codes but it's error
</a>
</li>
<li>
<div class="image_title">
Slide 2
</div>
<a href="#">
<img src="img/<?php echo $_GET['id']=2;?>.jpg" alt="" width="640" border="320"/>
</a>
</li>
<li>
<div class="image_title">
Slide 3
</div>
<a href="#">
<img src="img/3.jpg"/>
</a>
</li>
<li>
<div class="image_title">
Slide 4
</div>
<a href="#">
<img src="img/4.jpg"/>
</a>
</li>
<li>
<div class="image_title">
Slide 5
</div>
<a href="#">
<img src="img/5.jpg"/>
</a>
</li>
</ul>
<?php } ?>
Not knowing exactly what you get back from your query, here's a guess:
Replace any of your <img>s with
<img src="../img/<?php echo $row['id']?>.jpg" alt="" width="640" border="320"/>
To "debug" your data, you can replace your while loop with
while($row = mysql_fetch_array($result)){
print_r($row);
}
This will print out any data found in each row.
You might also want to replace the deprecated mysql_* functions with mysqli or PDO.

Yii2 Display Recently Added Members

I have a "Latest Staff Members" panel where it should display my recently added users. All I have is a static display of these users:
<div class="box box-danger <?= !User::isBizAdmin() ? 'hidden' : '' ?>">
<div class="box-header with-border">
<h3 class="box-title">Latest Staff Members</h3>
<div class="box-tools pull-right">
<span class="label label-danger">8 New Members</span>
<button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
<button class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
</div>
</div><!-- /.box-header -->
<div class="box-body no-padding">
<ul class="users-list clearfix">
<li>
<img src="https://cdn2.iconfinder.com/data/icons/avatar-2/512/frank_man-128.png" alt="User Image"/>
<a class="users-list-name" href="#">Alexander Pierce</a>
<span class="users-list-date">Today</span>
</li>
<li>
<img src="https://cdn2.iconfinder.com/data/icons/avatar-2/512/Ben_man-128.png" alt="User Image"/>
<a class="users-list-name" href="#">Norman</a>
<span class="users-list-date">Yesterday</span>
</li>
<li>
<img src="https://cdn2.iconfinder.com/data/icons/avatar-2/512/iri_girl_face-128.png" alt="User Image"/>
<a class="users-list-name" href="#">Jane</a>
<span class="users-list-date">12 Jan</span>
</li>
<li>
<img src="https://cdn2.iconfinder.com/data/icons/avatar-2/512/Jay_man-128.png" alt="User Image"/>
<a class="users-list-name" href="#">John</a>
<span class="users-list-date">12 Jan</span>
</li>
<li>
<img src="https://cdn2.iconfinder.com/data/icons/avatar-2/512/Fred_man-128.png" alt="User Image"/>
<a class="users-list-name" href="#">Alexander</a>
<span class="users-list-date">13 Jan</span>
</li>
<li>
<img src="https://cdn2.iconfinder.com/data/icons/avatar-2/512/michela_face_young-128.png" alt="User Image"/>
<a class="users-list-name" href="#">Sarah</a>
<span class="users-list-date">14 Jan</span>
</li>
<li>
<img src="https://cdn2.iconfinder.com/data/icons/avatar-2/512/carla_girl-128.png" alt="User Image"/>
<a class="users-list-name" href="#">Nora</a>
<span class="users-list-date">15 Jan</span>
</li>
<li>
<img src="https://cdn2.iconfinder.com/data/icons/avatar-2/512/hena_woman_face-128.png" alt="User Image"/>
<a class="users-list-name" href="#">Nadia</a>
<span class="users-list-date">15 Jan</span>
</li>
</ul><!-- /.users-list -->
</div><!-- /.box-body -->
<div class="box-footer text-center">
View All Users
</div><!-- /.box-footer -->
</div>
Something like that. Now, in the user table in my database, I added a date_added column and I manually put dates in row.
Do I loop the data? Or use a widget? I don't know how else I should implement this.
EDIT
My controller:
public function actionIndex()
{
if(Yii::$app->user->isGuest){
return $this->render('../site/index');
}
else{
$latestStaffMembers = User::find()->orderBy(['date_added' => SORT_DESC])->limit(8);
return $this->render('dashboard', [
'latestStaffMembers' => $latestStaffMembers,
]);
}
}
In my view:
<?php foreach ($latestStaffMembers as $user) { ?>
<li>
<img src="<?php echo $user->avatar; ?>" alt="User Image"/>
<?= $user->username ?>
<span ><?= $user->date_added ?></span>
</li>
<?php } ?>
Then I get this error:
Trying to get property of non-object
I tried var-dumping $user and it says null.
I'm not sure if this is what you want. I hope it helps somehow.
In your controller action:
$latestStaffMembers = User::find()->orderBy(['date_added' => SORT_DESC])->limit(8)->all();
return $this->render('some-view-file', [
'latestStaffMembers' => $latestStaffMembers,
]);
In your view:
<?php foreach ($latestStaffMembers as $user) { ?>
<li>
<img src="<?= $user->imagePath ?>" alt="User Image"/>
<a class="users-list-name" href="#"><?= $user->name ?></a>
<span class="users-list-date"><?= Yii::$app->formatter->asDate($user->dateAdded, 'd m'); ?></span>
</li>
<?php } ?>
Btw: I saw !User::isBizAdmin() in your code. Is it yours? I would not just hide the list if it is important that only admins may see that. Just don't print it if user is not admin.

Categories