Using Pelican, the python static site generator, I want to re-order how my pages display in the navigation.
My pages are html, not markdown/ reST.
According to the docs & How can I control the order of pages from within a pelican article category? I should be using:
PAGE_ORDER_BY = 'page-order'
In the pelicanconf.py.
I have tried the following meta tags in my html pages, and used the same number format in each page: ='000' ='111' etc.
<meta page-order="888">
<meta name="page-order" content="888">
I get the following error when compiling the site:
There is no "page-order" attribute in the item metadata. Defaulting to slug order.
What is the correct method of specifying page order in HTML pages?
Thanks in advance.
Solved this by following this structure:
in config (no hyphen):
PAGE_ORDER_BY = 'sortorder'
HTML Page Structure:
{% extends "base.html" %}
<html>
<head>
<title>Test</title>
<meta name="sortorder" content="222" />
</head>
<body>
</body>
</html>
Pelican removes the html/head/body and uses the ones included in your base html, but seems to need this structure to recognise the meta tags in the head.
Make sure to use the same number of digits in each content="", eg. 111, 222, 333 not 1, 222, 33.
Related
My original html source is below:
<html>
<head>
<title> aaaaa<bbbbb </title>
</head>
<body>
</body>
</html>
As you can see there is a mistake in the title. There is an unclosed < between aaaaa and bbbbb.
When I open this page with web browsers (firefox, chrome and edge), the browsers fix the problem and change the source code to this:
<html>
<head>
<title> aaaaa<bbbbb </title>
</head>
<body>
</body>
</html>
So is there a way to prevent browsers to fix problems in original htmls? When I browse, I want to see original html source.
Note: I am using firefox geckodriver with python/selenium. So any solution that includes a configuration in firefox or python code would be OK.
There are some fundamental difference between the HTML DOM shown through View Source i.e. using ctrl + U and the markup shown through Inspector i.e. using ctrl + shift + I.
Both the methods are two different browser features which allows users to look at the HTML of the webpage. However, the main difference is the View Source shows the HTML that was delivered from the web server (application server) to the browser. Where as, Inspect element is a Developer Tool e.g. Chrome DevTools to look at the state of the DOM Tree after the browser has applied its error correction and after any Javascript have manipulated the DOM. Some of those activities may include:
HTML error correction by the browser
HTML normalization by the browser
DOM manipulation by Javascript
In short, using View Source you will observe the Javascript but not the HTML. The HTML errors may get corrected in the Inspect Elements tool. As an example:
With in View Source you may observe:
<h1>The title</h2>
Whereas through Inspect Element that would have corrected as:
<h1>The title</h1>
This usecase
Based on the above mentioned concept the following markup:
<html>
<head>
<title> aaaaa<bbbbb </title>
</head>
<body>
</body>
</html>
gets corrected as:
<html>
<head>
<title> aaaaa<bbbbb </title>
</head>
<body>
</body>
</html>
I'd like to use Scrapy to crawl a few hundred websites and just scrape the basic (title, meta* and body) html elements. I know that I should use CrawlSpider for this and adjust some of the settings based on broad crawls. The part that I'm having trouble figuring it out is how to use xpath to create the rules for scraping just those basic html elements. Lots of tutorials I see involve inspecting the element and finding the css class for that element. That is fine for the body element but what about the title and meta tags?
There XPath and CSS selector you can use to select nodes in HTML.
the element is a node, but the node not always an element.
So, then you know head, meta, body are all elements. the class attributes in the div is the same as the charset attribute in meta element. They are all attributes nodes.
e.g:
<!DOCTYPE html>
<html lang='zh-cn'>
<head>
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="renderer" content="webkit">
<title>title</title>
</head>
<body>
<div>website content</div>
</body>
</html>
if you want to select
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
you can use XPATH like this:
//head/meta[#http-equiv="X-UA-Compatible"]
You can search the elements in <head> the same way you find in <body>, for example:
//html/head/title
or
//html/head/meta
Well for the title node you can write a simple XPath expression : //title which is the abbreviated syntax of /descendant-or-self::node()/child::title and that's it.
For the meta node guess what you can just write //meta too or if you want you can use the absolute path /html/head/meta
PS. You can do the same thing for the body node.
I have a list of filenames in Python, and I want to pass that to HTML. The HTML page should have different href links for each of the filenames in the list. If I pass the whole list then the href link is again a list (which does not allow me to click on different links), and if I use a for loop to pass the list elements one by one, it is getting displayed as different HTML pages.
EDIT: Here is my code. 'docs' is a list of filenames. This is printing "Results" followed by first link, then "Results" followed by second link, and so on. I want it to display "Results" and then all the links one below the other. Basically, I want the loop only for the 'a href' part.
def results(docs):
template = """
<html>
<head>
<title> Results </title>
</head>
<body>
%s
</body>
</html>
"""
html = ""
for i in range(len(docs)):
html = '\n'.join([html, template % (docs[i], docs[i])])
return html
PS: Sorry if the question is unclear, it is the first time I am posting a question on stackoverflow.
I'd actually use a template engine, like Mako. Working example:
from mako.template import Template
def results(docs):
template = """
<html>
<head>
<title> Results </title>
</head>
<body>
% for doc in docs:
${doc}
% endfor
</body>
</html>
"""
return Template(template).render(docs=docs)
print(results(["link1", "link2"]))
Prints:
<html>
<head>
<title> Results </title>
</head>
<body>
link1
link2
</body>
</html>
I'm working on an email template, therefor I would like to embed a css file
<head>
<style>{{ embed 'css/TEST.css' content here }}</style>
</head>
instead of linking it
<head>
<link href="{% static 'css/TEST.css' %}" rel="stylesheet" type="text/css">
</head>
Any ideas?
I guess you could use include
<style>{% include "/static/css/style.css" %}</style>
https://docs.djangoproject.com/en/1.9/ref/templates/builtins/#include
But it might be better to load the contents of the css file in your view, and put it in the context of your view to send it to the template
You can use django-compressor package. It will add {% compress %} template tag that can join together bunch of JS or CSS files (or inlined code) and put it into template as new, big file or inlined code. For example to inline one CSS file, you can use:
{% compress css inline %}
<link href="{% static 'css/TEST.css' %}" rel="stylesheet" type="text/css">
{% endcompress %}
You can add more CSS files into one compress tag, they will be concatenated together and wrapped into one <style>tag.
Check usage examples for more details.
On solution would be the use of include:
<head>
<style>{% include "../static/css/TEST.css" %}</style>
</head>
But it is kind of messy!
You have to place a copy or link to your css-file in your templates directory. Or you use a hardcoded link as above, which may break in production.
I wanted to use a third-party html/css example in Django, but it doesn't work.
<!DOCTYPE html>
<html>
<head>
<title>Example</title>
<link rel="stylesheet" type="text/css" href="/static/css/style.css" />
</head>
<body>
EXAMPLE CODE
</body>
</html>
I have used just this example, and commented all other code. Django recognizes the css file, I checked it. However, I don't get a sticky footer and header. They transform in a plain text, just like the main body.
I put this example in the codeacademy engine and it works there as well.
What hidden stones of Django I might be missing?
there is no hidden stones in django. there is no such option as recognize css file for django. Django has nothing to do with css files.
I recommend u to open network panel in browser developer tools console and check, was the css file downloaded successfully by browser or not.
in some case if u use django development server there is manual how to serve static files in development mode
https://docs.djangoproject.com/en/1.2/howto/static-files/
another cases are, misspelled css file name or misspelled/incorrect path to css file
https://docs.djangoproject.com/en/dev/howto/static-files/