Error I have an unwanted /a> showing up on a display page as Branch Line Card/a>. The link should read Branch Line Card. The error has not appeared until recently. I am not a coder in general - please help! The page link is http://guardianbp.com/branches/
Here is a sample of the code:
<!-- Product Catalog -->
<?php if ( !empty( get_field('branch_product_catalog'))): ?>
<section class="pt-medium pb-medium gray-bg">
<div class="container">
<div class="row">
<div class="col-md-1 col-sm-1 col-xs-1 "></div>
<div class="col-md-10 col-sm-10 col-xs-10 text-center">
<h1><span class="blue">Branch Line Card</span></h1>
<div class="lgbtn-icon-bg">
<a href="<?php the_field('branch_product_catalog'); ?>">
<button type="button" class="btn btn-lg-productcatalog btn-lg">
<i class="fa fa-book fa-5x"></i>
<h2><small>view the</small><br />
<?php the_title(); ?><br />
Branch Line Card</h2>
</button>
</a>
</div>
</div>
<div class="col-md-1 col-sm-1 col-xs-1"></div>
</div>
</div>
</section>
<?php endif; ?>
It looks like a mis-matched delimiter. There appears to be a lone "< a/>" floating between:
</button>
</a>
</div>
Related
I have two divs [one is upper | second is lower]. Both can fetch data from database and make accordingly number of divs. lower div is default hidden. I want to show lower div when I click upper div. jquery code that i make is here. Need your help.
Note. Show only current active lower div. All other lower divs must hidden. to do this
<!---upper div section--->
<?php
$id=1;
while ($comp_post_info=mysqli_fetch_array($query))
{
?>
<div class="container-fluid">
<div class="row">
<div class="upperdiv container-fluid mb-5">
<div class="row">
<div class="col-md-1 pdl-3">
<i class="fa fa-circle"></i>
</div>
<div class="col-md-11">
<div class="container-fluid">
<div class="row jlist" id="addbg">
<div class="col-md-4">
<img src="/my_brands/brand.png" alt="" class="cust-em">
<h6><?php echo $comp_post_info['title'] ?> <p><small><?php echo $comp_post_info['c_name'] ?></small></p></h6>
</div>
<div class="col-md-4">
<h6>
<?php echo $comp_post_info['state'] ?>,<?php echo $comp_post_info['coun'] ?>
<p><small>Location</small></p>
</h6>
</div>
<div class="col-md-4">
<h6>
<?php echo $comp_post_info['saly'] ?>
<p><small> Saly</small></p>
</h6>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!----lowerdiv--->
<div class="lowerdiv container-fluid hideme" id="mydiv" >
<div class="row pt-4 padl-5">
<h6>Other Prepositions <small>for gle</small></h6>
</div>
<div class="row">
<div class="col-md-11 offset-md-1">
<div class="container-fluid">
<div class="row sub_lowerdiv pt-2">
<div class="col-md-4">
<i class="fa fa-circle"></i>
<h6><?php echo $comp_post_info['title'] ?> <p><small><?php echo $comp_post_info['c_name'] ?></small></p></h6>
</div>
<div class="col-md-4">
<h6>
<?php echo $comp_post_info['state'] ?>,<?php echo $comp_post_info['count'] ?>
<p><small>Location</small></p>
</h6>
</div>
<div class="col-md-4">
<h6>
<?php echo $comp_post_info['saly'] ?>
<p><small>Saly</small></p>
</h6>
</div>
</div>
</div>
</div>
</div>
</div>
<?php
}
?>
** <script>
$(document).ready(function(){
$(".upperdiv").on("click",function(){
var currentselect = $(this).('.lowerdiv');
$(".lowerdiv").not(currentselect).hide();
currentselect.show();
});
});
</script> **
enter code here
Use closest to find the parent (I have added parent class .parent-div) and then use nextAll to find the first lowerdiv.
See the Snippet below:
$(document).ready(function(){
$(".upperdiv").on("click",function(){
var currentselect = $(this).closest(".parent-div").nextAll('.lowerdiv').first(); /* Look I've added find */
$(".lowerdiv").not(currentselect).hide();
currentselect.show();
});
});
.lowerdiv{
display: none;
margin-left: 15px;
}
.upperdiv{
cursor: pointer;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="parent-div container-fluid">
<div class="row">
<div class="upperdiv">
Upper 1
</div>
</div>
</div>
<div class="lowerdiv">
Lower 1
</div>
<div class="parent-div container-fluid">
<div class="row">
<div class="upperdiv">
Upper 2
</div>
</div>
</div>
<div class="lowerdiv">
Lower 2
</div>
<div class="parent-div container-fluid">
<div class="row">
<div class="upperdiv">
Upper 3
</div>
</div>
</div>
<div class="lowerdiv">
Lower 3
</div>
Card looks like this. i just want it to display to the side
Im trying to show data from my database in PHP codeigniter. the data shows fine. but the problem is that the card is going down istead to right. you can look at the image above.
i just want to make the card go to the right when i do foreach. and go down after 4/5 card.
i ve tried to move the foreach code but it looks just like that.
im using bootsrap 4
here's the code
<div class="row">
<div class="container">
<div class="card-body">
<?php
foreach ($user as $u) {?>
<div class="col-md-2 mt-4">
<div class="card mt-3" style="width:15rem;">
<img src="<?=base_url() . 'assets/img/' . $u->gambar_game;?>"
class="card-img-top img-responsive" alt="...">
<h5 class="card-title font-weight-bold "><?php echo $u->nama_game; ?></h5>
<p class="card-text"><?=$u->deskripsi_game;?></p>
<a href="<?=base_url() . 'assets/games/' . $u->link_game;?>"
class="btn btn-primary btn-block">Mainkan Game</a>
</div>
</div>
</div>
<?php }?>
</div>
</div>
you are repeating currently the whole container inside the row, but u want to repeat the cols inside the container.
Try this (loop over the col-md-2):
<div class="row">
<div class="container">
<div class="card-body">
<?php
foreach ($user as $u) {?>
<div class="col-md-2 mt-4">
<div class="card mt-3" style="width:15rem;">
<img src="<?=base_url() . 'assets/img/' . $u->gambar_game;?>"
class="card-img-top img-responsive" alt="...">
<h5 class="card-title font-weight-bold "><?php echo $u->nama_game; ?></h5>
<p class="card-text"><?=$u->deskripsi_game;?></p>
<a href="<?=base_url() . 'assets/games/' . $u->link_game;?>"
class="btn btn-primary btn-block">Mainkan Game</a>
</div>
</div>
</div>
<?php }?>
</div>
</div>
</div>
EDIT:
Your HTML structure was a little mixed up.
Try this. col-md-3 places 4 cols inside of your row, or col-md-2if you want 6 cols inside of your row. A row is max 12 cols bootstrap grid documentation
<div class="container">
<div class="row">
<?php foreach ($user as $u) {?>
<!-- col-md-2 -->
<div class="col-md-4 mt-4">
<div class="card">
<div class="card-body">
<img src="<?=base_url() . 'assets/img/' . $u->gambar_game;?>"class="card-img-top img-responsive" alt="...">
<h5 class="card-title font-weight-bold "><?php echo $u->nama_game; ?></h5>
<p class="card-text"><?=$u->deskripsi_game;?></p>
Mainkan Game
</div>
</div>
</div>
<!-- col-md-2 end -->
<?php }?>
</div>
</div>
I'm Struggling adjusting my articles here :
https://cryptoranger.net/news
I'm using bootstrap 4.3.0, here's the code of the rows :
<div class="row bg-light">
<?php
foreach ($newsList as $news){?>
<article class="col-md-4 blogpost border rounded p-0">
<div class="imgBx">
<img src="/images/<?=$news['image'] ?>" alt="" class="img-fluid">
</div>
<div class="content">
<h2 class="itemrecent1"><?= $news['titre'] ?></h2>
<p class="float-left m-0"><i class="fas fa-clock"></i> <?= $news['dateAjout']->format('Y-m-d') ?></p><br>
<p class="itemrecent1"><?= nl2br($news['contenu']) ?></p>
<?php
if ($category === 'news'){?>
<div class="itemrecent1">Read</div>
<?php
}else {?>
<div class="itemrecent1 justify-self-end">Read</div>
<?php
}?>
<div class="clearfix"></div>
</div>
</article>
<?php } ?> <!-- End of news -->
</div>
So i want gutters between my articles...
Besides, if you know how to adjust the content (text inside the box because i tried some flexbox css but nothing is changing (i want at least all Read link at the same level (bottom))...
==> It's working if i put some height in pixel but cant do that because i need responsive design..
Thanks... :D
The gutters are there, they come from the padding on the col-* classes. Because you added the border class to your articles the padding is, naturally, surrounded by a border. Usually when using Bootstrap grid layouts, content is placed within a wrapper element that has the desired col-* class:
<div class="row bg-light">
<?php
foreach ($newsList as $news){?>
<div class="col-md-4">
<article class="blogpost border rounded p-0">
<div class="imgBx">
<img src="/images/<?=$news['image'] ?>" alt="" class="img-fluid">
</div>
<div class="content">
<h2 class="itemrecent1"><?= $news['titre'] ?></h2>
<p class="float-left m-0"><i class="fas fa-clock"></i> <?= $news['dateAjout']->format('Y-m-d') ?></p><br>
<p class="itemrecent1"><?= nl2br($news['contenu']) ?></p>
<?php
if ($category === 'news'){?>
<div class="itemrecent1">Read</div>
<?php
}else {?>
<div class="itemrecent1 justify-self-end">Read</div>
<?php
}?>
<div class="clearfix"></div>
</div>
</article>
</div>
<?php } ?> <!-- End of news -->
</div>
Looks like you actually have it correct on another page on your site
I have created a accordion and its in a loop but i want only one accordion open at a time not multiple one. I have used data parent attribute of bootstrap but its not working. Any kind of help would be highly appreciated.
I want only one accordion open at one time. How to achieve it. I think i'm having this problem because of for each loop. Is there any way to solve it ?
Here is my code :
<?php if(!empty($tickets)) : ?>
<?php foreach($tickets as $ticket) : ?>
<div class="panel-group-custom" id="#panels">
<div class="panel panel-default mb-0 no-border">
<div class="panel-heading.panel-heading-custom" >
<h4 class="panel-title">
<div data-toggle="collapse" data-parent="#panels" data-target="#collapse<?php echo $ticket['SupportTicket']['id'] ?>" class="accordion-title">
<div class="row">
<div class="overflow-hidden">
<div class="col-md-2">
<span class="ticket-heading1" title="Ticket ID"><i class="fa fa-ticket" aria-hidden="true"></i> <?php echo $ticket['SupportTicket']['ticket_id']; ?> </span>
</div>
<div class="col-md-7"><span class="ticket-title"><?php echo $ticket['SupportTicket']['title'] ?></span></div>
<div class="col-md-2">
<span class="ticket-heading2" title="Ticket created on"><i class="fa fa-calendar" aria-hidden="true"></i>
<?php $bdate = date_create($ticket['SupportTicket']['modified']); ?>
<?php echo date_format($bdate,"d-M-Y") ?>
</span>
</div>
<div class="col-md-1">
<span class="accordion-down">
<i class="fa fa-chevron-down dropdown-toggle down-arrow2" aria-hidden="true"></i>
</span>
</div>
</div>
</div>
</div>
</h4>
</div>
<div id="collapse<?php echo $ticket['SupportTicket']['id'] ?>" class="panel-collapse collapse">
<div class="panel-body">
<div class="hidden-overflow ticket">
<div class="full-width hidden-overflow ticket-chat">
<p class="color-4 ticket-content">
<?php echo $ticket['SupportTicket']['description'] ?>
</p>
<?php if($ticket['SupportTicket']['status']>1) : ?>
<p class="color-1 pull-right ticket-content"> <span class="resolution">Feedback</span>
<?php echo $ticket['SupportTicket']['resolution_text']; ?>
<span class="ticket-updated"><span class="bolder"><i class="fa fa-clock-o" aria-hidden="true"></i>
<?php $bdate = date_create($ticket['SupportTicket']['modified']); ?>
<?php echo date_format($bdate,"d-M-Y") ?>
</span></span>
</p>
<?php endif ?>
</div>
<div class="full-width hidden-overflow mt-5">
<!-- <p class="ticket-close"><i class="fa fa-window-close" aria-hidden="true"></i> Closed on <span class="bolder">17-Aug-2017 </span></p>-->
</div>
</div>
</div>
</div>
</div>
</div>
<?php endforeach ?>
<?php else : ?>
No Records
<?php endif ?>
Try putting your #panels div outside the foreach loop - that way they are all in the same group.
Also, your #panels div should not have the "#" sign in its id.
<?php if(!empty($tickets)) : ?>
<div class="panel-group-custom" id="panels"><!-- Remove the '#' from here. -->
<?php foreach($tickets as $ticket) : ?>
<div class="panel panel-default mb-0 no-border">
<div class="panel-heading panel-heading-custom" ><!-- and remove the . from here. -->
<h4 class="panel-title">
<div data-toggle="collapse" data-parent="#panels" data-target="#collapse<?php echo $ticket['SupportTicket']['id'] ?>" class="accordion-title">
<div class="row">
<div class="overflow-hidden">
<div class="col-md-2">
<span class="ticket-heading1" title="Ticket ID"><i class="fa fa-ticket" aria-hidden="true"></i> <?php echo $ticket['SupportTicket']['ticket_id']; ?> </span>
</div>
<div class="col-md-7"><span class="ticket-title"><?php echo $ticket['SupportTicket']['title'] ?></span></div>
<div class="col-md-2">
<span class="ticket-heading2" title="Ticket created on"><i class="fa fa-calendar" aria-hidden="true"></i>
<?php $bdate = date_create($ticket['SupportTicket']['modified']); ?>
<?php echo date_format($bdate,"d-M-Y") ?>
</span>
</div>
<div class="col-md-1">
<span class="accordion-down">
<i class="fa fa-chevron-down dropdown-toggle down-arrow2" aria-hidden="true"></i>
</span>
</div>
</div>
</div>
</div>
</h4>
</div>
<div id="collapse<?php echo $ticket['SupportTicket']['id'] ?>" class="panel-collapse collapse">
<div class="panel-body">
<div class="hidden-overflow ticket">
<div class="full-width hidden-overflow ticket-chat">
<p class="color-4 ticket-content">
<?php echo $ticket['SupportTicket']['description'] ?>
</p>
<?php if($ticket['SupportTicket']['status']>1) : ?>
<p class="color-1 pull-right ticket-content"> <span class="resolution">Feedback</span>
<?php echo $ticket['SupportTicket']['resolution_text']; ?>
<span class="ticket-updated"><span class="bolder"><i class="fa fa-clock-o" aria-hidden="true"></i>
<?php $bdate = date_create($ticket['SupportTicket']['modified']); ?>
<?php echo date_format($bdate,"d-M-Y") ?>
</span></span>
</p>
<?php endif ?>
</div>
<div class="full-width hidden-overflow mt-5">
<!-- <p class="ticket-close"><i class="fa fa-window-close" aria-hidden="true"></i> Closed on <span class="bolder">17-Aug-2017 </span></p>-->
</div>
</div>
</div>
</div>
</div>
<?php endforeach ?>
</div><!-- end #panels (moved to after the foreach) -->
<?php else : ?>
No Records
<?php endif ?>
Here is the working version with the PHP stripped out: https://jsfiddle.net/ytcw2sot/
i am trying to add a button to the heading, but i cant figure that out.
It now looks this way:
The button should be at the light grey part at the right side of the "name". The code i am having now is:
<div class="panel panel-default bg-white nopadding">
<div class="panel-heading">
<div class="col-md-4">
<h3 class="text-uppercase text-faded">
<?php echo $info['c_name'];?>
</h3>
</div>
<div class="col-md-4">
<div class="input-group">
<div id="addcinfo" class="btn btn-success" name="search1">Redigera</div>
</div>
</div>
</div>
</div>
What do i am doing wrong?
The webpage is: http://109.74.0.128/~sarath/admin
username: Jonathan#inkhousemedia.se
pw: John#123
Go on "Kund" and search for saurav and you will see the error
Use below code:
<div class="panel panel-default bg-white nopadding">
<div class="panel-heading">
<h3 class="text-uppercase text-faded" style="float: left;"><?php echo $info['c_name'];?></h3>
<div class="input-group" style="padding: 5px 0 5px 20px">
<div name="search1" class="btn btn-success" id="addcinfo" >Redigera</div>
</div>
</div>
</div>
Add button class to your heading tag
<h1 class="btn btn-primary">Heading</h1>