I'm stuck with this problem. When I use Markdown + Nunjucks as explained in the metalsmith-in-place Wiki the output is wrong (see below).
The default layout, note the safe filter (_layouts/base.njk):
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>{{title}}</title>
</head>
<body>
{{ contents | safe }}
</body>
The template that is using Markdown + Nunjucks (about.md.njk):
---
title: About
layout: base.njk
---
# {{ title }}
Output:
<p><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>About</title>
</head>
<body></p>
<h1>About</h1>
<p> </body>
</html></p>
Solved right after posting the question. This may be help, the problem is the order of plugins in my build.js:
Metalsmith(__dirname)
.source('./contents')
.destination('./build')
.clean(true)
.use(inPlace()) // inPlace must come BEFORE layouts!
.use(layouts({
directory: '_layouts',
default: 'base.njk'
}))
.build(function(err) {
if (err) throw err;
});
Related
EDIT: I have found the solution. Since others may make the same mistake, I will put the answer at the bottom.
I am using Visual Studio Code. I am new to it.
I have Debugger For Chrome and Debugger For Edge installed.
I have Live Server installed.
I have launch.json
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"name": "Launch Chrome",
"request": "launch",
"type": "pwa-chrome",
"url": "http://127.0.0.1:5500/a.html",
"webRoot": "${workspaceFolder}"
}
]
}
I have my basic html file:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<button onclick="myfunc()">Click</button>
</body>
<script>
function myfunc(){
alert("clicked");
}
</script>
</html>
I have my breakpoint on the line alert("clicked");.
I click the Debugging icon on the left with the spider, and then click the green button to launch.
Now the weird bit:
The program launches and breaks immediately on the alert line, even though the button has not been pressed.
I continue.
But then when I click the button and expect the break point to be met. It is not. The alert occurs without breaking at all.
Anyone know what I am doing wrong?
Solution:
It does not like the <script> outside the body. If you change the html file to have the <script> inside the body, then it works fine.
Like so:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<button onclick="myfunc()">Click</button>
<script>
function myfunc(){
alert("clicked");
}
</script>
</body>
</html>
I found out what was going wrong.
It does not like the outside the body. If you change the html file to have the inside the body, then it works fine.
Like so:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<button onclick="myfunc()">Click</button>
<script>
function myfunc(){
alert("clicked");
}
</script>
</body>
</html>
I want to make a pdf invoice from blade template using Dompdf in Laravel 5.5.
The problem is when clicking on the download button the page is loading and after ~3 min i the pdf starts downloading.
Why is it taking so long?
the download link
<i class="fa fa-file-pdf-o"></i> Download Invoice
web route:
Route::get('/order/download-invoice/{OrderID}', 'Admin\AdminOrderController#downloadOrderInvoice')->name('admin.download-invoice');
a simple template (invoice.blade.php)
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other
head content must come *after* these tags -->
<title>Invoice</title>
<link rel="stylesheet" href="{{ asset('css/bootstrap.min.css') }}" media="screen">
</head>
<body>
<div>{{ $invoice->InvoiceTitle }} </div>
</body>
</html>
donwload invoice controller function:
use Barryvdh\DomPDF\Facade as PDF;
public function downloadOrderInvoice($OrderID){
$invoice = Invoice::where('OrderID', $OrderID)->first();
$pdf = PDF::loadView('invoice.invoice', compact('invoice'))->setPaper('a4', 'landscape');
return $pdf->download('invoice.pdf');
}
What i did wrong? Did i miss something?
UPDATE
clear the header and using EXTERNAL CDN bootstrap works.
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
</head>
Why is not using the local bootstrap using asset???
<link href="{{asset('css/bootstrap.min.css')}}" rel="stylesheet">
I'm new to FreeMaker Template, In the below example, I want to show the <#greet person="${name}"!/> macro for 10 seconds only, then need to remove it, any idea how can I make it?
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>${title} | Kweet</title>
</head>
<body>
<#greet person="${name}"!/>
<#include "/copyright_footer.html">
</body>
</html>
<#macro greet person color="black">
<font size="+2" color="${color}">Hello ${person}!</font>
</#macro>
You can do that with JavaScript (which you put into the template). It has nothing to do FreeMarker, as that only generates the page before it's sent to the browser.
I'm trying to get a very basic d3 visualization working, but all I get is a blank browser window.
Here's my index.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="code.js"></script>
<title>My Title</title>
</head>
<body>
<div class="container"></div>
</body>
</html>
Here's my code.js:
console.log("test");
d3.select("body").append("h1").html("Here are some words")
My console prints test. But nothing appears in the browser window. When I inspect element, nothing has been added.
I've tried loading the localhost page via python -m SimpleHTTPServer and via npm install -g http-server plus http-server &.
What's going wrong?
you need to change your HTML code for the following code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://d3js.org/d3.v4.min.js"></script>
<title>My Title</title>
</head>
<body>
<div class="container"></div>
<script type="text/javascript" src="code.js"></script>
</body>
</html>
I just put the line which reference the "code.js" inside the body tags
I am trying to set a template variable with a string containing an umlaut. The body content is converted correctly, but the variable looses its special characters.
If I have a simple template var-template.md
<!DOCTYPE html>
<html>
<head>
<title>$title$</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
</head>
<body>
<div>
$for(navi)$<button name="navi" value="$navi$">$navi$</button>$endfor$
</div>
<div>
$body$
</div>
</html>
and try to convert with variables set:
echo Hällo Wörld | pandoc -w html --template=var-template -V navi="Übung 1" -V title="Laß das döch"
it outputs:
<!DOCTYPE html>
<html>
<head>
<title>La� das d�ch</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
</head>
<body>
<div>
<button name="navi" value="�bung 1">�bung 1</button>
</div>
<div>
<p>Hällo Wörld</p>
</div>
</html>
So the body text is converted correctly, but the variables are not.
Is this a bug or a mistake?
I am on ubuntu 12.04 with pandoc 1.9.1 ... do I have to manually update from the repository-version to a newer on?
I just tried this with the latest pandoc release, and it worked fine, so you may just need to upgrade. You should also make sure that your locale is UTF-8.