How to insert page number using barryvdh/laravel-dompdf - laravel-5

I have been trying to insert page number using the package barryvdh/laravel-dompdf. But so far I am unsuccessful. How do I do this?

Look here
https://code.google.com/p/dompdf/wiki/FAQ
Also here is question on github
https://github.com/barryvdh/laravel-dompdf/issues/37
Found my answer by looking over the dompdf_config.inc.php file. As it turns out, DOMPDF_ENABLE_PHP is set to false thus causing the inline php script to be ignored. I simply edited dompdf_config.custom.inc.php to the following and all is fine and working with the later code in the view.
In dompdf/dompdf_config.custom.inc.php
<?php
define("DOMPDF_ENABLE_PHP", true);
Then, in my html file
<body>
<script type="text/php">
if ( isset($pdf) ) {
$font = Font_Metrics::get_font("helvetica", "bold");
$pdf->page_text(72, 18, "{PAGE_NUM} of {PAGE_COUNT}", $font, 6, array(255,0,0));
}
</script>
<div
If you go this route, don't forget to restart Apache
source How to get page number on dompdf PDF when using "view"

Related

barryvdh/laravel-dompdf - How to add javascript and/or jquery code into PDF

Thank you in advance
I am generating PDF with barryvdh/laravel-dompdf laravel library, i am able to add dynamic code to add in PDF but how to add javascript or jquery code
I tried like this
$pdf = PDF::loadView('invoice', compact('invoiceDetails'));
$pdf->setOptions(['enable_javascript', true])->setOptions(['javascript-delay', 13500])->save(public_path('invoice.pdf'));
invoice.blade.php looks like this (Just adding small code)
<h2 class="h2">Summary<span id="demo_span"></span> </h2>
<script type="text/javascript">
document.getElementById('demo_span').innerHTML ='THIS IS FOR AN EXAMPLE';
</script>
So the output would add text "THIS IS FOR AN EXAMPLE" where ID is demo_span
Firstly,
You have to set it in the package settings. Publish the config and change
it there.
To make it work, you need to use this JS bloc inside your PDF Blade :
<script type="text/javascript"> try { this.print(); } catch (e) { window.onload = window.print; } </script>

Wordpress Ajax Lite Placement

I have installed the Ajax Search Lite plugin for my wordpress site and have edited the Header.php file to place the code.
This is the code that I am currently using to display it:
<body>
<!-- Header -->
<section>
<div class="navbar navbar-inverse navbar-static-top">
<div class="container">
<?php echo do_shortcode('[wpdreams_ajaxsearchlite'); ?>
This is how it displays on my site currently and in the same screenshot points out where I would like place it:
Ajax Search Lite Placement
Is anyone able to help me achieve this? Is there a better way to implement the search function where I want rather than in the Header.php file?
Any assistance is really appreciated.
approach # 1 : add the short code, in the menu or theme files where your menu is getting rendered. (or)
approach # 2: You don't need a walker in this case. A filter called wp_nav_menu_items is available. It allows you to edit the list items of a menu. Just append your own list item with search field.
add_filter( 'wp_nav_menu_items', 'add_search_to_nav', 10, 2 );
function add_search_to_nav( $items, $args )
{
$items .= '<li>SEARCH'.do_shortcode('[wpdreams_ajaxsearchlite').'</li>';
return $items;
}
Ref: https://wordpress.stackexchange.com/questions/52286/using-a-menu-walker-add-a-custom-item-at-the-end-of-the-menus-items

CKEditor 4.4.5 removing page throw html, how to prevent?

In previous versions(3.5) of CKEditor I was able to enter:
<br style="page-break-after: always;" />
However, after upgrading to 4.4.5, I noticed that the RTE no longer shows this HTML source, from the Database column, and so if one resaves the form with this RTE on it, then NULL is saved back to the database. It seems that CKEditor is stripping this HTML out for some reason.
How can I prevent this?
Many thanks.
EDIT 1
Discovered this to be added to config.js:
config.allowedContent = 'br {page-break-after}';
But does not work, although it should do....
EDIT 2
Link for above config setting
EDIT 3
I can try to enter the above HTML, in HTML Source View, but if I toggle the HTML Source button, and go back to Source View, it is now gone. So CKEditor is stripping this HTML out for some reason.
EDIT 4
Removed as now irrelevant
EDIT 5
Looking at the Browser source I see:
<textarea class="RuleRTE" cols="20" id="myCk" rows="2"><br style="page-break-after: always;" /> </textarea>
So clearly the data is there and being retrieved, but being converted which prevents me seeing it in the HTML Source view.
I have now found this is irrelevant as <p>test</p> test fine and it gets converted as well, I guess to prevent it being rendered like normal HTML in the page. So it seems the CKEditor does not like the tag ???
EDIT 6:
Removed as now irrelevant to question.
EDIT 7:
Debug JS:
<script type="text/javascript" language="javascript">
var editor = CKEDITOR.replace('Content', {
allowedContent: 'br[*]'
});
editor.on('instanceReady', function () {
console.log(editor.filter.allowedContent);
});
Results seem to show allowedContent is working fine, but BR element still invisible.
[Object, Object]
0: Object attributes: true
classes: null
elements: Object br: true
I suspect that there's a syntax or usage error with the way you're attempting to modify the allowedContent setting. Try doing something more simple along these lines: (do it in code rather than the config file)
var your_ck_editor = CKEDITOR.replace( 'your_ck_element_id', {
allowedContent: 'br[*]'
} );
The br[*] setting should allow any <br /> element with any attribute.
For troubleshooting purposes try this:
console.log( your_ck_editor.filter.allowedContent );
If this code does not work for you please post all the code that you use to set up your CKEditor as well as the output of your console.log call.

Filtering the loop by category using Ajax in Wordpress

Well, I have been looking everywhere for hours and hours and it seems like there's so many ways to do this, since I have never used Ajax before and have little knowledge of havascript, its become too hard for me.
I have the loop on my front page (index) or wordpress and I want to have a filter, a dropdown menu with different categories, that when clicked, the only posts showing in that same screen are the ones from that category. I need the loop to be refreshed with ajax, so the whole page is still left intact while you use the filter.
this is what i have on my Index file:
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">google.load("jquery", "1.2.6")</script>
<script type="text/javascript">
$(function(){
$('#main_cat').change(function(){
var $mainCat=$('#main_cat').val();
$("#sub_cat").empty();
// call ajax
$.ajax({
url:"<?php bloginfo('wpurl'); ?>/wp-admin/admin-ajax.php",
type:'POST',
data:'action=my_special_ajax_call&main_catid=' + $mainCat,
success:function(results)
{
// alert(results);
$('#sub_cat *').fadeOut(500);
$('#sub_cat + p').fadeOut(500);
$("#sub_cat").append(results);
$('#sub_cat').load('http://localhost:8888/public_html/wp-content/themes/twentyten-child/templateloop.php');
$('#sub_cat + p').fadeIn(1);
}
});
}
);
});
The dropdown with the categories goes like this:
<?php
wp_dropdown_categories('show_count=0&selected=-1&hierarchical=1&depth=1&hide_empty=0&exclude=1&show_option_none=Main Categories&name=main_cat');
?>
So, the dropdown works, and it's supposed to ajax load a wp template file with a query filtering only one category (grabbed from the wp_dropdown_categories). And the loading works fine if I have a dummy text in the templateloop.php file, but when I have the wp query, nothing happens. the #sub_cat div, which is where the loop is located and was supposed to be switched by the template file just dissapears with all the post listing and im left only with the top half of the page (until where the #sub_cat div used to be).
There has been so much trial and error, ive tried with the query call in the template file, in the index file, in the functions, i never seem to get any result.
on my functions.php file ive got this:
function implement_ajax() {
if(isset($_POST['main_catid']))
{
echo '<?php $paged = (get_query_var("paged")) ? get_query_var("paged") : 1; query_posts("cat='.$_GET['maincatid'].'&paged=$paged"); ?>';
die();
} // end if
}
add_action('wp_ajax_my_special_ajax_call', 'implement_ajax');
add_action('wp_ajax_nopriv_my_special_ajax_call', 'implement_ajax');//for users that are not logged in.
and the query line i used to use before all this, in the index file is:
<?php $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
query_posts("cat=1,2,3,4,5&paged=$paged"); ?>
i've tried using the wp_query but it's just going nowhere, i really need guidance. Any help is appreciated. thank you.
That is more complicated than it needs to be. You shouldn't need additional queries or AJAX at all. If you theme is using the post_class() function as it should be, your posts all have classes associated with your categories. These classes are the category name prepended with 'category-'-- 'category-uncategorized', for example. All you really need to do is show and hide posts based on those classes.
I haven't written anything specifically for your circumstance but I have done this with some very large search results-- sometimes 400 or more per page-- and it works quite well. Here is the idea: Use jQuery to watch your select menu. You want change. When the select changes, parse the information to work out the category (I don't know off hand what information wp_dropdown_categories() includes in its markup.), show() the selected category and hide() everything else.

Reloading everything but one div on a web page

I'm trying to set up a basic web page, and it has a small music player on it (niftyPlayer). The people I'm doing this for want the player in the footer, and to continue playing through a song when the user navigates to a different part of the site.
Is there anyway I can do this without using frames? There are some tutorials around on changing part of a page using ajax and innerHTML, but I'm having trouble wrapping my head aroung getting everything BUT the music player to reload.
Thank you in advance,
--Adam
Wrap the content in a div, and wrap the player in a separate div. Load the content into the content div.
You'd have something like this:
<div id='content'>
</div>
<div id='player'>
</div>
If you're using a framework, this is easy: $('#content').html(newContent).
EDIT:
This syntax works with jQuery and ender.js. I prefer ender, but to each his own. I think MooTools is similar, but it's been a while since I used it.
Code for the ajax:
$.ajax({
'method': 'get',
'url': '/newContentUrl',
'success': function (data) {
// do something with the data here
}
});
You might need to declare what type of data you're expecting. I usually send json and then create the DOM elements in the browser.
EDIT:
You didn't mention your webserver/server-side scripting language, so I can't give any code examples for the server-side stuff. It's pretty simple most of time. You just need to decide on a format (again, I highly recommend JSON, as it's native to JS).
I suppose what you could do is have to div's.. one for your footer with the player in it and one with everything else; lets call it the 'container', both of course within your body. Then upon navigating in the site, just have the click reload the page's content within the container with a ajax call:
$('a').click(function(){
var page = $(this).attr('page');
// Using the href attribute will make the page reload, so just make a custom one named 'page'
$('#container').load(page);
});
HTML
<a page="page.php">Test</a>
The problem you then face though, is that you wouldnt really be reloading a page, so the URL also doesnt get update; but you can also fix this with some javascript, and use hashtags to load specific content in the container.
Use jQuery like this:
<script>
$("#generate").click(function(){
$("#content").load("script.php");
});
</script>
<div id="content">Content</div>
<input type="submit" id="generate" value="Generate!">
<div id="player">...player code...</div>
What you're looking for is called the 'single page interface' pattern. It's pretty common among sites like Facebook, where things like chat are required to be persistent across various pages. To be honest, it's kind of hard to program something like this yourself - so I would recommend standing on top of an existing framework that does some of the leg work for you. I've had success using backbone.js with this pattern:
http://andyet.net/blog/2010/oct/29/building-a-single-page-app-with-backbonejs-undersc/
You can reload desired DIVs via jQuery.ajax() and JSON:
For example:
index.php
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script type="text/javascript" src="ajax.js"></script>
<a href='one.php' class='ajax'>Page 1</a>
<a href='two.php' class='ajax'>Page 2</a>
<div id='player'>Player Code</div>
<div id='workspace'>workspace</div>
one.php
<?php
$arr = array ( "workspace" => "This is Page 1" );
echo json_encode($arr);
?>
two.php
<?php
$arr = array( 'workspace' => "This is Page 2" );
echo json_encode($arr);
?>
ajax.js
jQuery(document).ready(function(){
jQuery('.ajax').click(function(event) {
event.preventDefault();
// load the href attribute of the link that was clicked
jQuery.getJSON(this.href, function(snippets) {
for(var id in snippets) {
// updated to deal with any type of HTML
jQuery('#' + id).html(snippets[id]);
}
});
});
});

Resources