I'm making wordpress plugin through wp-content/plugins folder and I want to pass Dropbox button into a specific page but I get undefined add_shortcode
this's the html code I want to pass in the plugin currently indeed
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="style.css">
<!-- Dropbox library for importing the Dropbox button the webpage -->
<script type="text/javascript" src="https://www.dropbox.com/static/api/2/dropins.js" id="dropboxjs"
data-app-key="XXXX></script>
<body>
<div class="dropbox_btn" style=" margin: auto !important; width: 50% !important; ">
<!-- dropboxContainer is the id of Dropbox button which will be added in script.js file -->
<div id="dropboxContainer"></div>
</div>
</body>
</html>
<?php
define("ABSPATH", "C:/xampp/htdocs/wordpress/");
require_once(ABSPATH . 'wp-includes/shortcodes.php');
require_once(ABSPATH . 'wp-includes/functions.php');
function dropbox()
{
$text = "Dropbox APi Plugin";
return $text;
}
add_shortcode('example', 'dropbox');
Related
I am using a basic html structure for my PDF template together with <htmlpagefooter> according to the mPDF docs.
A sample implementation can be found here
<html>
<head>
<style>
.mydiv {
color: red;
}
</style>
</head>
<htmlpagefooter name="myfooter">
Page {PAGENO} of {nb}
</htmlpagefooter>
<sethtmlpagefooter name="myfooter" value="on" />
<body>
<div class="mydiv">
This is my PDF file
</div>
</body>
</html>
When I generate my PDF it will refuse to show the footer on any page. When I put PHP code inside it will throw an appropriate error proving that it is parsed into the mPDF.
Because you are using a <body> tag inside an <html> tag, you have to make sure your footer is included in code that will be rendered on a page.
When you include the footer outside of the body, it will not be shown in the PDF.
When you include the footer inside the body, it will render as expected.
So a succesfull implementation of a footer in mPDF would look like this;
<html>
<head>
<style>
.mydiv {
color: red;
}
</style>
</head>
<body>
<htmlpagefooter name="myfooter">
Page {PAGENO} of {nb}
</htmlpagefooter>
<sethtmlpagefooter name="myfooter" value="on" />
<div class="mydiv">
This is my PDF file
</div>
</body>
</html>
I'm trying to create an upload system similar to YouTube.
But in PDF. When you upload a video to YouTube, you create a page.
I already have a code for the page that would be the pdf. But I needed to know how I could create a page that does the upload and modify the html by changing the pdf link
* pdfListView.loadPdf ("/ upload / ebooks / 1.pdf"); *
Follow the code below
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Demo of pdfListView</title>
<style>
.page-container {
margin: 10px auto;
}
.page-view canvas {
box-shadow: black 0px 0px 10px;
}
</style>
<!-- File from the PDF.JS Library -->
<script type="text/javascript" src="external/compatibility.js"></script>
<script type="text/javascript" src="external/pdf.js"></script>
<script type="text/javascript">PDFJS.workerSrc = 'external/pdf.worker.js';</script>
<!-- Leave out the following two files if you don't need a textLayer -->
<link rel="stylesheet" href="src/TextLayer.css">
<script src="src/TextLayerBuilder.js"></script>
<!-- Leave out the following two files if you don't need an annotations layer -->
<link rel="stylesheet" href="src/AnnotationsLayer.css">
<script src="src/AnnotationsLayerBuilder.js"></script>
<!-- Core pdfListView file -->
<script src="src/PdfListView.js"></script>
</head>
<body>
<div id="main" style="position: absolute; top:0px; bottom:0px; left: 0; right: 0; overflow:scroll">
<!-- The pageContainers go here !-->
</div>
<script type="text/javascript">
window.pdfListView = new PDFListView(
document.getElementById("main"),
{
// Comment out the next line to get a listView without textLayer.
textLayerBuilder: TextLayerBuilder,
annotationsLayerBuilder: AnnotationsLayerBuilder,
logLevel: PDFListView.Logger.DEBUG
}
);
pdfListView.loadPdf("http://playofthegame.me/ebooks/A_HIST%c3%93RIA_SECRETA_DA_MA%c3%87ONARIA_E_ORDEM_ROSACRUZ_-_por_Jakim_Booz.pdf");
</script>
</body>
</html>
Pdf fuction*
This function is call from ajax after getting data from this function it's call anothe file here I am display data which is coming from data base.That file all css part in style tag using then as it is style tag prind in pdf as a text and if this all css file include in css folder then pdf is not create in proper format
public function actionInvoicespacking(){
$pdf = Yii::$app->pdf;
$modelShipment = Shipment::find()->orderBy('ship_id DESC')->one();
if(count($modelShipment) == 0) {
$shipid= 1;
} else
{
$shipid= $modelShipment->ship_id;
}
$htmlContent = file_get_contents('http://localhost/shepherdlogistics_v1.0/backend/views/shipment/invoicespackingdata.php');
$pdf->content = $htmlContent;
return $pdf->render();
}
invoicespackingdata.php
<!DOCTYPE html>
<html lang="en">
<head>
<title>Invoice</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/bootstrap.fontawesome.min.css">
<link rel="stylesheet" href="css/stylepdf.css">
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<style type="text/css">
body {
font-size: 18px;
font-family: cambria;
}
.nopadd {
padding: 0px;
}
</style>
</head>
<body>
<div class="container">
<br>
<br>
<div class="">
<div class="col-lg-2 nopadd">
<img src="logopdf.png" alt="logo" width="100%">
</div>
<div class="col-lg-10">
<h1 style="font-size: 55px;font-weight: bold; padding: 23px 0px;">
SHEPHERD LOGISTICS CO. W.L.L.</h1>
</div>
</div>
</div>
</div>
As the demo states:
Any <style> tag will be skipped (you must use cssInline property for this)
If you have just a few styles to add to the pdf, you can pass it like this:
$pdf->content = $htmlContent;
$pdf->cssInline = '.class1 {color: red} .class2 {color:blue}';
But if you have alot of styles, you can also consider change the default cssFile to any file you want with the correct css. (by default, this property is #vendor/kartik-v/yii2-mpdf/assets/bootstrap.min.css
I have been working on converting html simple template to WordPress theme so I create folder into xampp - htdocs - wp-content - themes and I create inside this folder 8 files
footer.php , functions.php , header.php , index.php , page.php
sidebar.php , single.php , style.css
In footer file i add this code:-
</div>
<?php get_sidebar();?>
<div style="clear: both;"> </div>
</div>
</div>
</div>
<!-- end #page -->
</div>
<div id="footer">
<p>Copyright (c) 2013 Sitename.com. All rights reserved. | Photos by Fotogrph | Design by FreeCSSTemplates.org.</p>
</div>
<!-- end #footer -->
</body>
</html>
and in header file i add this code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title><?php bloginfo('title'); ?></title>
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600' rel='stylesheet' type='text/css'>
<link href="<?php bloginfo('stylesheet_url'); ?>" rel="stylesheet" type="text/css" media="screen" />
<?php wp_head(); ?>
</head>
<body>
<div id="wrapper">
<div id="header-wrapper">
<div id="header">
<div id="logo">
<h1><?php bloginfo('name'); ?></h1>
<p><?php bloginfo('description'); ?></p>
</div>
</div>
</div>
<!-- end #header -->
<div id="menu">
<?php wp_nav_menu(); ?>
</div>
<!-- end #menu -->
<div id="page">
<div id="page-bgtop">
<div id="page-bgbtm">
<div id="content">
and in index file this code
<?php get_header(); ?>
test
<?php get_footer(); ?>
I go to my admin page and find this as a theme there and I active it.
But I find it very empty and I didnt know what wrong.
If you get only blank screen then in most cases there is some misconfiguration in functions.php, do you have any code in there?
I'm not sure if it will solve your problem, but try using wp_enqueue_style() function in your functions instead of echoing your styles in header.
function theme_slug_enqueue( ){
wp_enqueue_style( 'open-sans', http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600' );
wp_enqueue_style( 'main-style', get_stylesheet_directory_uri() . 'style.css' );
}
Put that in your functions.php, and delete elements from your header.
bloginfo('stylesheet_url') function only gets your main directory url, you are not calling your mains style.css anywhere as I can see. If you don't want to use wordpress standard enqueue function at least try changing
<link href="<?php bloginfo('stylesheet_url'); ?>" rel="stylesheet" type="text/css" media="screen" />
to:
<link href="<?php bloginfo('stylesheet_url') . 'style.css'; ?>" rel="stylesheet" type="text/css" media="screen" />
refference: https://codex.wordpress.org/Function_Reference/wp_enqueue_style
Wordpress theme required atleast two files to work so first check your theme by including only two files in your theme folder
wp-content/themes/mytheme/
style.css
index.php
add these lines in your style.css file
/*
Theme Name: My theme
Version: 1.0
*/
and add these line in your index.php file
this is theme testing
then run your wordpress website and check
Well you have to create a new folder inside the theme folder. SO it should look like this
wp-content
themes
Theme-name (lets say bruno)
header.php
footer.php
index.php
style.css
Now in style.css, its important that you add these comments.
/*
Theme Name: Bruno theme
Theme URI: Your site
Author: Your name
Author URI: http://yoursite.org/
Description: Some description
Version: 1.0
*/
These comments will tell wordpress all the information about your theme
I have created PHP files which accept data from $_GET method.
After that I use all the data I get to create HTML pages. Nothing is wrong with the data but in CSS I cannot style HTML elements. Except when it comes to inline styling, that works but it is not good to maintain.
I try to use like this but it doesn't work , Please Help
THANK IN ADVANCE
Example.php
<?php
$dataCover = $_GET['dataCover'];
$dataTitle = $_GET['dataTitle'];
$dataTag = $_GET['dataTag'];
$dataDir = $_GET['dataDir'];
$dataYear = $_GET['dataYear'];
$dataCreated = $_GET['dataCreated'];
$dataModified = $_GET['dataModified'];
$userAUID = $_GET['userAUID'];
$galleryID = $_GET['galleryID'];
?>
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css" media="all">
#container img{
height: 230px;
width: 200px;
}
#container .center{
display: block;
margin: 0 auto;
}
</style>
<script src="../lib/jquery-1.10.2.min.js"></script>
<script src="../lib/jquery.mobile-1.3.1.min.js"></script>
<script src="../lib/se.js"></script>
</head>
<body>
<div data-role ="page" id ="page1">
<div data-role ="header">
<h1> header </h1>
</div>
<div data-role="content">
<div id="container">
<img class="center" src="<?echo $dataCover?>" alt=""/>
<p id="title"><?echo $dataTitle;?></p>
<p id="tag"><?echo $dataTag;?></p>
<p id="created">Created : <?echo $dataCreated?></p>
<p id="modified">modified : <?echo $dataModified?></p>
View Ebook-Gallery
Bookmark
</div>
</div>
</div>
</body>
</html>
When you move your css from inline to style sheet file, you have to refresh your page with Ctrl+F5. Maybe it's coming from the cache.
Also you can assign your css to the image by jquery.
I dont see any reference to any external stylesheet, so it seems like you have forgotten to do this.
Put this line
<link rel="stylesheet" type="text/css" href="/css/style.css" />
Somewhere in the head. Maybe before the script tags.
Make sure you adjust the path to your stylesheet.
Yes When you want to apply external css you have to give the path after the <title> tags within the <head> tags .just follow the html code
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="css/style.css" />
<!--Here css is the folder name where you have keep the style.css file -->
<script src="../lib/jquery-1.10.2.min.js"></script>
<script src="../lib/jquery.mobile-1.3.1.min.js"></script>
<script src="../lib/se.js"></script>
</head>