Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision
Previous revision
en:create:texts [28.11.2014 11:39] adminen:create:texts [13.02.2024 19:00] (current) admin
Line 1: Line 1:
-====== Text elements ======+====== Text Elements ======
  
-To enter texts independently from a certain question, the most convenient way is this:+Texts are -- besides questions -- the most important component of questionnaires. You need them for greetings, longer explanations and often as stimuli (e.g. articles). Texts are created likely questions in a section. Select the desired section and click //Add text// in the **Questionnaire** on the left.
  
-  - Go to **Text elements and labels** at the sidebar under **Questionnaire** +Enter a //description// for the text that only you as the project manager will see. Then you can select different display variants for the text.
-  - Click on //New text element// +
-  - Enter a short //ID// for internal use (e.g. "welcome"+
-  - Enter the //text//. You can format it using HTML (see below) +
-  - Save the text block by clicking on //OK// +
-  - To insert it into the questionnaire, go to **Compose questionnaire**The newly created text element is now visible on the right under //Texts, images, audio//. You can drag-and-drop the text element into the questionnaire page. You can position it above, between or beneath questions or alone on an own page.+
  
-===== Other possibilities =====+  * Standard is a "simple text". This fits seamlessly into the questionnaire from the formatting and allows simple formatting via [[#wiki-notation|wiki notation]]. 
 +  * The "Formatted Text" display allows formatting with an editor. **Important:** Please do __not__ copy text directly from Microsoft Word into a formatted text. This will copy a lot of unnecessary formatting, which can lead to display errors later. 
 +  * For more sophisticated design, you can directly enter HTML or JavaScript using the "HTML Code" display. For example, you can also include videos ([[:en:create:media]]). 
 +  * You can display extensive information clearly as a text ([[:en:create:accordion|accordion]])
  
-There are 4 different ways how to implement texts into the questionnaire.+If desired, you can also enter text content in the //Title// tab that will be formatted like a question. As soon as you save the text ({{:button.save.png?nolink|Save button}}), it will appear in the question catalog.
  
-  * //Text elements//\\ Try to always use text elements for texts. The questionnaire will stay clean and slimand you are able to use functions like multilingual surveys+ 
-    * [[:en:glossary#drag_drop|Dragging and dropping]] text elements into the questionnaire- + 
-    * Implementing text elements using the php function ''[[functions-base#text|text()]]''+===== Use in Questionnaire ===== 
-  * //HTML-Code directly in the questionnaire//\\ Use HTML-code only to insert short snippets of code (e.g. when placing questionnaire elements) or if you have to insert dynamically created content without using placeholders. + 
-    * Drag a //HTML-code//-element into the questionnaire and enter your HTML-code. +There are 4 possibilities of embedding texts in questionnairesOn the one hand you can enter HTML code directly in the questionnaire, on the other hand you can use text modules (see above). Direct typing of HTML code makes the **Questionnaire compilation** quite confusing, therefore we recommend creating texts in the question catalog. In addition to different formatting, these also support [[:en:create:multilang|multilingual questionnaires]]. 
-    * Insert HTML-code using the PHP-function ''[[functions-output#html|html()]]''The following example shows HTML-code divided into several lines for better legibility.+ 
 +  * //Texts//\\ Texts from the question catalog are included in the questionnaire in the same way as questions under **Composing questionnaire**: 
 +    * Drag text via [[:en:glossary#drag_drop|Drag & Drop]] into the questionnaire. 
 +    * Include text with the PHP function ''[[:en:create:functions:text|text()]]'' or ''[[:en:create:functions:show|show()]]''
 +  * //HTML code directly in the questionnaire//\\ Use HTML code in the questionnaire only if you need either very short snippets of HTML code (e.g. to place questionnaire elements) or if you need to insert dynamically generated content directly (not using placeholders)
 +    * Drag a block of type //HTML-Code// into the questionnaire and type HTML code directly there
 +    * Include HTML code in the questionnaire with the PHP function ''[[:en:create:functions:html|html()]]''As you can see in the following example, the HTML code can be spread over several lines for clarity:
  
 <code php> <code php>
 html(' html('
-  <h1> Heading <br> +  <h1> Anmeldung zum Proseminar <br> 
-  Instruments for online surveys </h1>+  Instruments for the online survey </h1>
 '); ');
 </code> </code>
  
-===== Text formatting ===== 
  
-There are two ways to format texts: a wiki-format for simple formatting (e.g. in question texts) and HTML-format for advanced formatting (e.g. in welcome texts). You may mix both notations as desired. +===== Text Formatting ===== 
 + 
 +If you create a text in the **List of Questions** you can directli in edit in the editor. The formatting is the transaltet in HTML code in the background. But also questions, explanations, items and other desciptions can be formatted. There are two ways to format texts: a wiki-format for simple formatting (e.g. in question texts) and HTML-format for advanced formatting (e.g. in welcome texts). You may mix both notations as desired. 
  
 ==== Wiki-Notation ==== ==== Wiki-Notation ====
  
-Use double underscores (''_'')slashes (''/'') and asterisks (''*'') to highlight words or sentences. At some placesuse the enter key to break lines.+The Wiki notation allows simple highlights - no matter if in independent textsquestionsitems or verbal scale anchors.
  
 **Tip:** Use highlighting __very__ sparingly. A homogenous layout looks much more professional. You should not use more than 3 accentuations per page - otherwise the layout will be more confusing than helpful. **Tip:** Use highlighting __very__ sparingly. A homogenous layout looks much more professional. You should not use more than 3 accentuations per page - otherwise the layout will be more confusing than helpful.
Line 42: Line 47:
 | bold | <nowiki>**Text**</nowiki> | <nowiki>What is **your opinion** on this?</nowiki> | What is **your opinion** on this? | | bold | <nowiki>**Text**</nowiki> | <nowiki>What is **your opinion** on this?</nowiki> | What is **your opinion** on this? |
 | italic | <nowiki>//Text//</nowiki> | <nowiki>Rate between //never// and //often//</nowiki> | Rate between //never// and //often// | | italic | <nowiki>//Text//</nowiki> | <nowiki>Rate between //never// and //often//</nowiki> | Rate between //never// and //often// |
 +| Heading 1 | <nowiki>=== Text ===</nowiki> | <nowiki>=== A. Bulk ===</nowiki> | {{scr.texts.example.h1.png}} |
 +| Heading 2 | <nowiki>== Text ==</nowiki> | <nowiki>== A.1. Definition ==</nowiki> | {{scr.texts.example.h2.png}} |
 +| Horizontal ruler, separator | <nowiki>--</nowiki> | Paragraph\\ <nowiki>--</nowiki>\\ Paragraph | {{:de:create:scr.texts.example.hr.png}}|
 | no line break | <nowiki>$$Text$$</nowiki> | <nowiki>No line break at the hyphen: $$e-mail-</nowiki>\\ <nowiki>address$$</nowiki> | No line break at the hyphen:\\ e-mail-address | | no line break | <nowiki>$$Text$$</nowiki> | <nowiki>No line break at the hyphen: $$e-mail-</nowiki>\\ <nowiki>address$$</nowiki> | No line break at the hyphen:\\ e-mail-address |
 +| Tooltip | <nowiki>((*|Content))</nowiki> | <nowiki>Wiki-((Notation|Notation means notation))</nowiki> |
 +| Link | <nowiki>[[URL|Title]]</nowiki> | <nowiki>[[https://www.soscisurvey.de/|SoSci Survey]]</nowiki> | [[https://www.soscisurvey.de/|SoSci Survey]] |
  
 If you want text parts to show in the questionnaire, but not as variable labels in your dataset, use double curly brackets (''{'' and ''}''). Texts marked like this also won't show up using the query [[:en:create:functions:value|value()]] in correspondence with the format code ''label''. If you want text parts to show in the questionnaire, but not as variable labels in your dataset, use double curly brackets (''{'' and ''}''). Texts marked like this also won't show up using the query [[:en:create:functions:value|value()]] in correspondence with the format code ''label''.
Line 52: Line 62:
  
 Technically, you enter HTML-code at any position in the questionnaire. HTML (HyperText Markup Language) is the standard format for websites in the internet. Don't be afraid - you won't need to know everything about HTML to use it for simple tasks like implementing pictures or texts. It just may be helpful to know the structure. Technically, you enter HTML-code at any position in the questionnaire. HTML (HyperText Markup Language) is the standard format for websites in the internet. Don't be afraid - you won't need to know everything about HTML to use it for simple tasks like implementing pictures or texts. It just may be helpful to know the structure.
 +
 +**Tip:** If you struggle a bit with writing HTML code at first, an online HTML editor such as [[https://html-online.com/editor/|HTML-Online.com]] can be helpful.
  
 HTML-Code is made out of two parts: The //actual information// that is to be displayed in the browser and tags around this information that define //how// to display the information. Tags are written in pointy brackets. The following example highlights the tags: HTML-Code is made out of two parts: The //actual information// that is to be displayed in the browser and tags around this information that define //how// to display the information. Tags are written in pointy brackets. The following example highlights the tags:
Line 57: Line 69:
 **HTML-Code** **HTML-Code**
 <code html> <code html>
-<h1>Hello world</h1> +<h1>Hello World</h1> 
-<p>How are you, world?</p>+<p>How are you, World?</p>
 </code> </code>
 +
  
 Translated into human language, this example says nothing else, but: Translated into human language, this example says nothing else, but:
Line 83: Line 96:
 Sometimes, you will need to define additional attributes to tags. The ''<img>''-tag, for example, needs to know where to find the image (''src'', "source") and which text to show in case the image can't be displayed (''alt'', alternative), Sometimes, you will need to define additional attributes to tags. The ''<img>''-tag, for example, needs to know where to find the image (''src'', "source") and which text to show in case the image can't be displayed (''alt'', alternative),
  
-**HTML-Code** 
 <code html> <code html>
-<img src="https://www.soscisurvey.de/help/layout/logo.SoSci-oFb.150.png" alt="Logo">+<img src="logo.gif" alt="Logo">
 </code> </code>
  
en/create/texts.1417171142.txt.gz · Last modified: 28.11.2014 11:39 by admin
 
Except where otherwise noted, content on this wiki is licensed under the following license: CC Attribution-Share Alike 4.0 International
Driven by DokuWiki