Is there a way to change the "Exam 1" to another word like "Homework 1" by passing arguments?
If not, is there a default template I can modify?
My last resort is to modify the built html files but it's not very convenient.
The exams2html() function takes an argument template which defaults to "plain.html". This template is shipped with the exams package and contains:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Exam ##ID##</title>
<style type="text/css">
body{font-family: Arial, Helvetica, Sans;}
</style>
<meta charset="utf-8" />
</head>
<body>
<h2>Exam ##ID##</h2>
##\exinput{exercises}##
</body>
</html>
The ##ID## is replaced by the ID (from 1 to n) and the ##\exinput{exercises}## is replaced by an ordered list <ol> containing the questions and optionally also the solutions. You can modify this template in any way you need and call it, say, homework.html. Then you can call:
exams2html(..., template = "/path/to/homework.html",
question = "<h4>Exercise</h4>", solution = FALSE)
which sets the template and also modifies the way the question is displayed while suppressing the solution.
Remark: The placeholders ##ID## and ##\exinput{exercises}## are a bit awkward (analogous to the placeholders in LaTeX templates for exams2pdf()) and not very flexible. It has been on my wishlist to make this more flexible, e.g., using {{mustache}} templating via the whisker package, but so far I didn't get round to tackle that.
Related
I have a very simple webpage.
<html>
<head>
<title/>
</head>
<body>
<h1>hello</h1>
</body>
</html>
breaks my webpage ,both in Chrome and Firefox
the issue is with self-closing Title tag ,removing TITLE tag or adding a title fix the issue
<title>Test Page</title>
Whats the issues with self-closing TITLE tags , couldn't find any reference to say its invalid
If you have a void element:
<img />
<br />
Then they have no content, because there's nowhere to put it. Images can be thought of as an empty <div> with a background image.
Compared to these elements:
<h1>Hello</h1>
<section>World</section>
Which actually contain stuff (in this case, text).
The reason that the <title/> breaks your page is because you need a title in a webpage - if you don't have one, it'll just display the URL of the page, for example:
google.com/index.html
You need to have a valid title, and <title> is not a void element. This is why it breaks. To see this, go to a HTML validation website (e.g. https://validator.w3.org) and see what it tells you.
In short - <title> is not a void element - it requires an opening and closing tag.
EDIT: Research showed me this website, which says:
Self-closing: No
So in short they're not self-closing elements. You can find a list of self-closing elements here.
The following code segment for an FAQ, which uses XHTML 1.0, will not validate successfully in the W3C validator.
I’m inserting the Q&A into a definition list in order to maintain the question & answer relationship semantically. The problem is, the questions can be multiple paragraphs. And the <dt> tag, at least in XHTML 1.0, only allows for inline elements. So I can’t put a <p> tag in there without throwing an error in the W3C validator.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<dl>
<dt>
<p>This is a very long question.</p>
<p>It has multiple paragraphs.</p>
</dt>
<dd>
<p>This is the answer</p>
</dd>
</dl>
</body>
</html>
Is there a semantically better way of coding this using XHMTL 1.0 Transitional?
For reference, the latest similar thread I can find on the topic is this is What is the best way to semanticly structure a FAQ?. The thread was useful, however it does not cover multiple paragraphs in the question.
Using the dl element doesn’t seem to be appropriate.
XHTML 1.0 uses the element definitions from HTML 4.01, where the dl element is defined to be a "definition list". A list of Q&As is probably not a definition list (unless, maybe, the term to be defined is just phrased as question, e.g., "What is the definition of foo?").
HTML5 re-defines the dl element: it’s no longer a definition list, but an "association list", or "description list". It might be appropriate to use it for Q&As, and the dt element can now also contain most of the flow content elements (which includes p). So this might be suitable if you want to use (X)HTML5. (The example for dt even shows a FAQ.)
Possible alternatives, depending on the actual content and context:
Just use p and rely on textual semantics, i.e., the "?" makes clear that it’s a question. You could also prefix them with "Question:" and "Answer:" (e.g., in b).
Use a heading (h1-h6) for each Q&A. As they neither may contain p elements, you might have to use something like "Question 1" as heading content, and rely on the text again.
I'm trying to figure out how to add CSS in Genshi to some markup which is dynamically generated. I'm trying to avoid inline CSS, and ideally the rules would appear in the <head/> tag of the parent document.
I'm working with existing code that looks like this (I rewrote this from the original, to simplify, so I might have some syntax mistakes; but the original works, so I think you can ignore syntax mistakes if any):
templates/widgets/file_widget.html
<html xmlns:py="http://genshi.edgewall.org/"
xmlns:xi="http://www.w3.org/2001/XInclude"
py:strip="">
<head>
<style type="text/css">
.file-widget {
background-color:#eee; display:inline-block; padding:4px;
}
</style>
</head>
<py:def function="file_widget(file_name)">
<div class=".file-widget">
...
</div>
</py:def>
</html>
widgets.py
class FileWidget:
...
def html():
markup_template = genshi.template.MarkupTemplate('''
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:py="http://genshi.edgewall.org/" xmlns:xi="http://www.w3.org/2001/XInclude">
<xi:include href="my_project/widgets/file_widget.html" />
${description}
${file_widget(file_name)}
</html>''')
markup = markup_template.generate(file_name = self.file_name, description = genshi.core.Markup(self.description))
return markup.render('html', doctype = 'html')
templates/main_page.html
<div py:for='widget in app.widgets'>
${ genshi.core.Markup( widget.html() ) }
</div>
Unfortunately, the <style/> tag gets rendered twice: once, as I want it to be, inside the original document <head/>, and then the widget <head/> gets rendered again.
How can I change the code to properly include the CSS in the right place? Since this is collaborative code, little changes and clearer code are appreciated!
Thanks for reading and for your help.
You might want to use a widget library like ToscaWidget2 which is meant to actually manage widgets with resources.
Otherwise you might want to use a static files framework like fanstatic which provides support for resources inclusion: http://www.fanstatic.org/en/1.0a5/quickstart.html#including-resources-with-fanstatic
If you want to roll your own custom solution you should register the resources somewhere whenever the widget is rendered (like in request) and then add them to the head tag when template is rendered. This is actually what tw2.core.resources does: https://github.com/toscawidgets/tw2.core/blob/develop/tw2/core/resources.py
Does anyone know if it is possible have the output of knit2html (i.e. markdownToHTML) wrapped in an HTML container?
Currently, everything gets dumped into <body>, which does not provide a lot of flexibility for controlling the layout.
For example, what I would like to from something like:
example.md
<div id='main'>
Markdown
========
some text, etc. here...
</div>
To:
example.html
<!DOCTYPE html>
<html>
<head> ... </head>
<body>
<div id='main'>
(HTML VERSION OF MARKDOWN
</div>
</body>
</html>
If I leave out the div container, the markdown is translated perfectly and placed at the top-level of <body>. What I would like to do is simply place in in a child container of body, thus allowing me to have finer control over the formatting of the contents.
Any ideas?
In your call to markdownToHTML set an option called fragment_only:
markdownToHTML(..., options=c('fragment_only')
That'll skip putting it in a body, I believe, and then you should be able to do with it as you will.
You should be able to specify that in a call to knit2html as well, as part of the ... argument.
I have a grok'ed plone.directives.form code below:
class EditForm(TreeFormMixin, form.SchemaForm):
"""
Edit form for our model.
We got one dummy button which allows us to manually inspect the data postback values.
"""
grok.context(ISiteRoot)
grok.name("dgftreeselect-test")
grok.require('zope2.View')
ignoreContext = True
schema = IFormSchema
label = u"Tree selection demo and manual testing"
#button.buttonAndHandler(u'Turbo boost')
def handleApply(self, action):
data, errors = self.extractData()
if errors:
self.status = self.formErrorsMessage
return
raise ActionExecutionError(Invalid(u"Please see that data stays intact over postback"))
it results to this form - which is not that good looking:
Since it is a demo form I'd like to keep all the related material in the same .py file. However, as the form is ugly looking, I'd like to inject a <style> CSS block on the page from a Python source code string to fix some of the most outstanding issues with the CSS styles.
What kind of hooks plone.app.forms / BrowserViews provide to inject your own <style> block in the <head> or in any part of the resulting HTML page? I prefer not to create any additional files and CSS registrations for this task.
Full source:
https://github.com/miohtama/collective.z3cform.dgftreeselect/blob/master/src/collective/z3cform/dgftreeselect/testform.py
plone.app.z3cform and Zope browser views don't provide any hooks to inject custom things into the head directly, but you can use a custom template by specifying the template attribute in the form class:
template = grok.Template('path/to/template.pt')
And then in template.pt, fill the style_slot to include your styles. The entire template could look like this:
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"
xmlns:tal="http://xml.zope.org/namespaces/tal"
xmlns:metal="http://xml.zope.org/namespaces/metal"
xmlns:i18n="http://xml.zope.org/namespaces/i18n"
lang="en"
metal:use-macro="context/main_template/macros/master"
i18n:domain="plone">
<body>
<metal:block fill-slot="style_slot">
<style type="text/css">
/* insert styles here */
</style>
</metal:block>
<metal:content-core fill-slot="main">
<metal:content-core define-macro="content-core">
<tal:button metal:use-macro="context/##ploneform-macros/titlelessform" />
</metal:content-core>
</metal:content-core>
</body>
</html>
This is not a best practice since the styles must be served every time the widget is rendered. Instead it's usually better to register CSS in the portal_css tool.