I have a php code like this :
<?php foreach ($pks as $k => $v): ?>
<div class="content">
//print something
</diV>
<?php endforeach ?>
I need like this. Each looping, I open a new page.
So, In css :
#media print {
.content {page-break-after: always;}
.content:last-of-type{
page-break-after: avoid;
}
}
But in last page, it creates a new page which is blank.
Please advise.
I had the same issue, and for me this code worked:
<style>
.pageBreak {
page-break-after: always;
}
</style>
#php
$size = count($envelopes_paychecks);
$pages = 1;
#endphp
#foreach ($envelopes_paychecks as $employee)
<div>
...
</div>
#php
if ( $pages < $size) {
echo '<span class="pageBreak"></span>';
}
$pages++;
#endphp
#endforeach
Related
Hello I am trying to use the jQuery toggle function just to change a ul display state from:
display: none;
to
display: block;
and this works however I am receiving the information from the database and with jQuery toggle it is showing all of the information not specifically from category id in which i click on
Here's what I have so far:
<section id="categories-wrapper">
<div class="cat-center">
<?php foreach($categories as $cat) { ?>
<?php if($cat['parent_id'] < 1) { ?>
<li>
<img src="media/categories/<?php echo $cat['image']; ?>">
<ul>
<?php
$childCategories = $objCatalogue->getChildCategories($cat['id']);
?>
<?php foreach($childCategories as $childCat) { ?>
<li><?php echo $childCat['name']; ?></li>
<?php } ?>
</ul>
</li>
<?php } ?>
<?php } ?>
</div>
</section>
the js code:
$('.cat-center li').click(function() {
event.stopPropagation();
$('.cat-center li ul').toggle('blind');
});
Now with the jQuery toggle when i click on the first link it shows the information from the other link as well, but with CSS using the hover command to just change display to block it works. Could someone please advise on what I am doing wrong.
Try changing your $('.cat-center li ul').toggle('blind');
to
$('.cat-center li').click(function() {
event.stopPropagation();
if ($(this).find('ul').is(":visible"))
{
$(this).find('ul').hide(500);
}
else
{
$('.cat-center li ul').hide(500);
$(this).find('ul').toggle('blind');
}
});
https://jsfiddle.net/m6jLo547/
So I need some help from a Ziggeo user. I have registered 8 videos in my ziggeo server and now I want to display them in pages divided by 2 videos per page.
Here is what I wrote, but unfortunately it doesn't show me any video, but the compiler doesn't say any error.
<?php include('./ziggeo/pagination.class.php');?>
<?php $myvideos = $ziggeo->videos();
$myarray = array($myvideos);?>
<div class="gallery">
<?php if(count($myarray)){
$pagination = new pagination($myarray, (isset($_GET['page'])?$_GET['page']:1), 3);
$videos = $pagination->getResults();
if(count($videos)!=0) {
echo $pageNumbers = '<h2>'.$pagination->getLinks().'</h2>';
foreach ($videos as $video) {?>
<div class="wall-of-videos-container">
<ziggeo ziggeo-video="<?= $video->token ?>"
ziggeo-width=320 ziggeo-height=240 ziggeo-popup> </ziggeo>
<?= date("Y-m-d h:i a", $video->created) ?>
·<?= $video->duration ?> seconds</div>
<? } echo $pageNumbers; } } ?>
</div><!-- End Gallery -->
I included all the files needed for the Ziggeo configuration.
Who can help me? Thank a lot!
Without seeing 'pagination.class.php' file contents and the output that you are creating it is difficult to know what went wrong, however to create pagination in PHP using Ziggeo PHP SDK, you would do something like this:
<?php
require_once('Ziggeo.php');
$ziggeo = new Ziggeo('YOUR TOKEN', 'YOUR PRIVATE KEY', 'YOUR ENCRYPTION KEY');
?>
You can get the token and keys from your dashboard on ziggeo.com
Ziggeo.php can be retrieved from Ziggeo PHP SDK here: github.com/Ziggeo/ZiggeoPhpSdk
Now looking at your code it seems that this is the call that you are not making correctly. To get the videos you should make the following call:
<?php $myvideos = $ziggeo->videos()->index(); ?>
It is good to remember that by default you will only get up to 50 videos, so if you are expecting to have more than that, you should set the limit parameter.
You can set limit, skip, reverse, states and tags
In case you want to get up to 100 videos (which is maximum per call) you would do something like this:
<?php
$myArguments = array('limit' => 100);
$myvideos = $ziggeo->videos()->index($myArguments);
?>
Now to list them, you would do something like this:
<?php
foreach ($myvideos as $video) {
?>
<ziggeo ziggeo-video="<?php echo $video->token; ?>" ziggeo-width=320 ziggeo-height=240 ziggeo-popup></ziggeo>
<?php
}
?>
You could add a check with count($myvideos) before foreach, however it should not be needed.
In general, to create a page with 2 videos per page you could use something like this:
<?php
$i = 0; //to have two videos per page
$j = 0; //to see how many we have
foreach ($myvideos as $video) {
$j++;
if($i === 0) { ?>
<div class="gallery_page">
<?php } ?>
<ziggeo ziggeo-video="<?php echo $video->token; ?>" ziggeo-width=320 ziggeo-height=240 ziggeo-popup></ziggeo>
<?php
$i++;
if($i === 2) { ?>
</div>
<div class="page_number"><?php echo $j/2; ?> </div>
<?php
$i = 0;
}
}
if($i !== 0) {
?>
<div class="page_number"><?php echo (($j-1)/2)+1; ?> </div>
<?php
}
?>
It is good to point out that the above code is not a complete paging system - it is just a simple sample that shows you how you could do it, however it would need to be customized and worked upon further to match gallery style, and similar.
Looking at your code, I think that it should work using something like this:
<?php
include('./ziggeo/pagination.class.php');
$myvideos = $ziggeo->videos()->index();
?>
<div class="gallery">
<?php
if(count($myvideos)) {
$pagination = new pagination($myarray, (isset($_GET['page']) ? $_GET['page']:1), 3);
$videos = $pagination->getResults();
if(count($videos)!=0) {
echo $pageNumbers = '<h2>'.$pagination->getLinks().'</h2>';
foreach ($videos as $video) { ?>
<div class="wall-of-videos-container">
<ziggeo ziggeo-video="<?php echo $video->token; ?>" ziggeo-width=320 ziggeo-height=240 ziggeo-popup></ziggeo>
<?php echo date("Y-m-d h:i a", $video->created); ?>
·<?php echo $video->duration; ?> seconds</div>
<?php } echo $pageNumbers;
}
} ?>
</div><!-- End Gallery -->
I did presume however that you have the headers set in the HTML HEAD of the page where the gallery will be shown:
<link rel="stylesheet" href="//assets-cdn.ziggeo.com/v1-latest/ziggeo.css" />
<script src="//assets-cdn.ziggeo.com/v1-latest/ziggeo.js"></script>
<script type="text/javascript">ZiggeoApi.token="YOUR TOKEN"</script>
If not present, the HTML code will be created from the above PHP code, however your videos would not be shown due to Ziggeo framework not being loaded on client side.
UPDATE (2016/05/31)
As the above is just general way to do this, it is not including CSS nor JavaScript.
As such I am adding the full code that can be used and as it shows another way to collect the page numbers and leaving the above so that someone can see both.
<script type="text/javascript">
//Basic code needed to switch pages
var currentPage = 1;
function showPage(number) {
//If we are on the same page as the selected one, we just break away from the function, so that we do not hide the same.
if(currentPage === number) { return false; }
var toShow = document.getElementById('page_' + number);
var toHide = document.getElementById('page_' + currentPage);
toShow.style.display = 'block';
toHide.style.display = 'none';
currentPage = number;
}
</script>
<style type="text/css">
/* Code to hide the pages (all) and show first one only, as well as a bit of styling so that it has some basic frame */
.gallery_page > ziggeo {
float: left;
}
.gallery_page {
background-image: linear-gradient(-45deg, lightGray, white);
border-radius: 10px;
box-shadow: 0 0 2px gray;
box-sizing: border-box;
display: none;
min-height: 400px;
margin: 20px 0;
padding: 40px;
width: 720px;
}
.gallery_page:first-child {
display: block;
}
.page_number {
box-shadow: 0 0 3px gray;
float: left;
margin: 0 4px;
text-align: center;
width: 2em;
}
</style>
<div class="gallery">
<?php
//How many videos per page do we want to have?
$numberOfVideos = 2;
//How many videos was there in total?
$totalNumberOfVideos = 0; //only if we need it for something later on
//How many videos are approved / are shown
$totalNumberOfApprovedVideos = 0; //only if we need it for something later on
//which page are we working on?
$currentPage = 1;
//Will serve as buffer for page number elements
$pageNumbers = '';
//temporary videos counter
$i = 0;
foreach ($myvideos as $video) {
//to only show approved videos
if($video->approved === true) {
if($i === 0) { ?>
<div class="gallery_page" id="page_<?php echo $currentPage; ?>">
<?php } ?>
<ziggeo ziggeo-video="<?php echo $video->token; ?>" ziggeo-width=320 ziggeo-height=240 ziggeo-popup></ziggeo>
<?php
$i++;
if($i === $numberOfVideos) { ?>
<br style="float:none; clear:left;">
</div>
<?php
$pageNumbers .= '<div onclick="showPage(' . $currentPage . ');" class="page_number">' . $currentPage . '</div>';
$currentPage++;
$i = 0;
}
$totalNumberOfApprovedVideos++;
$totalNumberOfVideos++;
}
else {
//$video->moderation_reason
//If you want to check if there was a reason why the video was not approved, you can check the above, or alternatively, you could do something else at this point.
$totalNumberOfVideos++;
}
}
if($i !== 0) {
$pageNumbers .= '<div onclick="showPage(' . $currentPage . ')" class="page_number">' . $currentPage . '</div>';
}
?>
</div><!-- End Gallery -->
<?php echo $pageNumbers; ?>
<?php
//This is not needed for pagination to work, however you might want to show it, etc
echo '<br><br>';
echo 'Approved videos: ' . $totalNumberOfApprovedVideos . '<br>';
echo 'Total videos: ' . $totalNumberOfVideos . '<br>';
echo 'Total number of pages: ' . $currentPage . '<br>';
echo $numberOfVideos . ' videos per page<br>';
?>
It is good to point out that this is just a framework - so the code mentioned before will work just as the followup code does, however both require additional styling and code to make it look nice and behave as we want it.
After adding the java script below:
<script type="text/javascript">
var currentPage = 1;
function showPage(number){
var toShow = document.getElementById('page_' + number);
var toHide = document.getElementById('page_' + currentPage);
toShow.style.display = 'block';
toHide.style.display = 'none';
currentPage = number;}
</script>
And the right references to the div gallery, now all is working. Thanks Bane.
I have a code for product tpl witch I need a condition if a category id=12 echo.. THe code below works on opencart 1.5.6.4 but on 2.0 doesn't generate anything.
<?php if(isset($this->request->get['path'])) {
$path = $this->request->get['path'];
$cats = explode('_', $path);
$cat_id = $cats[count($cats) - 1];
}
?>
<?php if (isset($cat_id) && $cat_id == '108') { ?>
<div style="text-align: right;"><a href = "javascript:void(0)" onclick ="document.getElementById('fade').style.display='block'" style="
color: rgb(221, 0, 23);">Mesurments table</a></div>
<div id="fade" class="black_overlay"><a class="close" href = "javascript:void(0)" onclick = "document.getElementById('fade').style.display='none'"></a><img src="/image/data/misc/blugi.jpg"style="
width: 100%;"></div>
?php } ?>
The reason this no longer works is because in 2.0> templates are rendered via the Loader object, not the Controller object.
You'll need to declare your $cat_id variable inside the product controller as a data variable.
So let's clean this up and make it a bit more usable.
In catalog/controller/product/product.php add:
if (isset ($this->request->get['path'])) {
$path = $this->request->get['path'];
$cats = explode('_', $path);
$data['cat_id'] = $cats[count($cats) - 1];
}
Then in your template you can access $cat_id as you like.
In your product.tpl file, in the javascript area at the bottom add:
<script type="text/javascript"><!--
$('#fade-link').css({
color: rgb(221, 0, 23)
}).on('click', function() {
$('#fade').show();
});
$('#fade a.close').on('click', function(){
$('#fade').hide();
});
//--></script>
Then replace your existing code with:
<?php if ($cat_id && $cat_id == '108') { ?>
<div style="text-align: right;">
<a id="fade-link">Measurements Table</a></div>
<div id="fade" class="black_overlay">
<a class="close"></a>
<img src="/image/data/misc/blugi.jpg" style="width: 100%;">
</div>
<?php } ?>
This should get you there, or at least be pretty close, I didn't test it, you may need to adjust the JS.
I have the following shortcodes in a page or post:
[custom_width width='500' color='red']
[custom_width width='600' color='blue']
The shortcode function is to display 2 buttons with their respective width. The problem is that the buttons are displayed the same width using the last width of 600.
The function:
<?php
function xyz ($attr) {
$xyzwidth = $attr['width'];
$xyzcolor = $attr['color'];
my_style($xyzcolor);
?>
<style type="text/css">
.mystyle {
width: <?php echo $xyzwidth; ?>px;
}
</style>
<div class="mystyle">
My Text
</div>
<?php } ?>
note: the rest of the css is in its own .css file
function my_style($xyzcolor) {
switch ($xyzcolor) {
case 'red': my_red();
break;
case 'blue': my_blue();
break;
}
<?php function my_red() { ?>
<style type="text/css">
.mystyle {
............
}
.mystyle: hover {
............
}
.mystyle a {
............
}
.mystyle a:hover {
............
}
</style>
<?php } ?>
If you're using the same class (mystyle) on both buttons, the last width defined on that class will apply to both elements.
For your purposes, you're probably better off with:
<?php
function xyz ($attr) {
$xyzwidth = $attr['width'];
?>
<div style="width: <?php echo $xyzwidth; ?>px">
My Text
</div>
<?php
}
?>
Define your blue and red CSS in general. Not in your loop every time. Something like this:
<style type="text/css">
// red
.mystyle.red {
............
}
.mystyle.red:hover {
............
}
.mystyle.red a {
............
}
.mystyle.red a:hover {
............
}
// blue
.mystyle.blue {
............
}
.mystyle.blue:hover {
............
}
.mystyle.blue a {
............
}
.mystyle.blue a:hover {
............
}
</style>
And in your xyz function, give your div the desired class, and set the width of div internal:
<?php
function xyz ($attr) {
$xyzwidth = $attr['width'];
$xyzcolor = $attr['color'];
my_style($xyzcolor);
?>
<div class="mystyle <?php echo $xyzcolor; ?>" style="width: <?php echo $xyzwidth; ?>px;">
My Text
</div>
<?php } ?>
The CSS that I'm attempted to attach to 'echo $tube->error;' is not showing.. It just shows as default black text as if it had no css... How would I fix this?
Thanks (:
Below is what I need to fix..
The html/php part:
<div id="error">
<pre>
<?php } else {
echo $tube->error;
}
}
?>
</pre>
</div>
The html/php part in context:
<?php
if(isset($_POST['url']))
{
include('curl.php');
include('youtube.php');
$tube = new youtube();
$links = $tube->get($_POST['url']);
if($links) { ?>
<div id="result">
<b>Download Links ( Same IP Downloading only )</b> :
<?php
$format = '<p>Download video.%s - %s<br/>Right-click download link and choose etc...</p>';
while($link = array_shift($links))
{
echo vsprintf($format,$link);
}
?>
</div>
<div id="error">
<pre>
<?php } else {
echo $tube->error;
}
}
?>
</pre>
</div>
The CSS:
#error {
width:404px;
margin-left: auto;
margin-right: auto;
font-size:12;
font-family: 'Dosis', sans-serif;
color:white;
padding-top:20px;
}
The part of youtube.php(additional info.. not sure if you guys need this):
function get($url)
{
$this->conn = new Curl('youtube');
$html = $this->conn->get($url);
if(strstr($html,'verify-age-thumb'))
{
$this->error = "Adult Video Detected";
return false;
}
if(strstr($html,'das_captcha'))
{
$this->error = "Captcah Found please run on diffrent server";
return false;
}
if(!preg_match('/stream_map=(.[^&]*?)&/i',$html,$match))
{
$this->error = "Error Locating Downlod URL's";
return false;
}
Thanks again for any help!!
EDIT: I was wrong, it wasn't a CSS error, but a construct error, as others have noticed. I just rewrote the "The html/php part in context" to make it more clear and hopefully working:
<?php
if(isset($_POST['url']))
{
include('curl.php');
include('youtube.php');
$tube = new youtube();
$links = $tube->get($_POST['url']);
if($links)
{
?>
<div id="result">
<b>Download Links ( Same IP Downloading only )</b> :
<?php
$format = '<p>Download video.%s - %s<br/>Right-click download link and choose etc...</p>';
while($link = array_shift($links))
{
echo vsprintf($format,$link);
}
?>
</div>
<?php
}
else
{
?>
<div id="error">
<pre>
<?php echo $tube->error; ?>
</pre>
</div>
<?php
}
}
?>
Hope everything is ok now :)
Try this code:
<?php
if (isset($_POST['url'])) {
include('curl.php');
include('youtube.php');
$tube = new youtube();
$links = $tube->get($_POST['url']);
if ($links) {
?>
<div id="result">
<b>Download Links ( Same IP Downloading only )</b> :
<?php
$format = '<p>Download video.%s - %s<br/>Right-click download link and choose etc...</p>';
while($link = array_shift($links)) {
echo vsprintf($format,$link);
}
?>
</div>
<?php } else { ?>
<div id="error">
<pre>
<?php echo $tube->error; ?>
</pre>
</div>
<?php } } ?>
Don't forget to include the CSS... and please, please write more readable in the future.
Your <div id="error"> is never rendered if there is an error, because your else statement only includes the error text itself. Move the div and pre inside the else to get it working.
<?php } else { ?>
<div id="error">
<pre>
<?php echo $tube->error; ?>
</pre>
</div>
<?php } ?>
Try this css:
#error pre {
width:404px;
margin-left: auto;
margin-right: auto;
font-size:12;
font-family: 'Dosis', sans-serif;
color:white;
padding-top:20px;
}
Try to define your CSS also for #error pre and not only #error:
div#error {
width:404px;
margin-left: auto;
margin-right: auto;
padding-top:20px;
}
div#error pre
{
font-size:12;
font-family: 'Dosis', sans-serif;
color:white;
}
Use also an inspector (like Chrome's one, that you call with CTRL+I) to make sure:
- there are not overrides that undo there lines
- CSS is properly loaded (if in an external file)