From 3855648c3d008bd752a5db76cc308ca9972e6958 Mon Sep 17 00:00:00 2001 From: Tobias Diekershoff Date: Sun, 16 Aug 2015 18:08:46 +0200 Subject: [PATCH 1/9] 0th iteration of the theming documentation --- doc/themes.md | 266 ++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 266 insertions(+) create mode 100644 doc/themes.md diff --git a/doc/themes.md b/doc/themes.md new file mode 100644 index 000000000..1e15b3df8 --- /dev/null +++ b/doc/themes.md @@ -0,0 +1,266 @@ +# Themes + +* [Home](help) + +To change the look of friendica you have to touch the themes. +The current default theme is [duepunto zero](https://github.com/friendica/friendica/tree/master/view/theme/duepuntozero) but there are numerous others. +Have a look at [friendica-themes.com](http://friendica-themes.com) for an overview of the existing themes. +There are several ways to change a theme. +You can either directly work on an existing theme. +But you might loose your changes when the theme is updated by the friendica team. +In cases where you are almost happy with an existing theme, the easiest way to cover your needs is to create a new theme, inheritating most of the properties of the parent theme and change just minor stuff. +The beloow for a more detailed description of theme heritage. + +Some themes also allow users to select *variants* of the theme. +Those theme variants most often contain an additional [CSS](https://en.wikipedia.org/wiki/CSS) file to override some styling of the default theme values. +From the themes in the main repository *duepunto zero* and *vier* are using this methods for variations. + +Third you can start your theme from scratch. +Which is the most complex way to change friendicas look. +But it leaves you the most freedom. +So below for a detailed description and the meaning of some special files. + +## Styling + +If you want to change the styling of a theme, have a look at the themes CSS file. +In most cases, you can found these in + + /view/theme//style.css + +sometimes, there is also a file called style.php in the theme directory. +This is only needed if the theme allowes the user to change certain things of the theme dynamically. +Say the font size or set a background image. + +If you want to change the structure of the theme, you need to change the templates used by the theme. +Friendica themes are using [SMARTY3](http://www.smarty.net/) for templating. +The default template can be found in + + /view/templates + +if you want to override any template within your theme create your version of the template in + + /view/theme//templates + +any template that exists there will be used instead of the default one. +The same rule applies to the JavaScript files found in + + /js + +they will be overwritten by files in + + /view/theme//js. + +## Expand an existing Theme + +### A new Variation for duepuntozero + +In + + /view/theme/duepuntozero/deriv + +you find a couple of CSS files that define color derivations from the duepunto theme. +These resemble some of the now as unsupported marked themes, that were inherited by the duepunto theme. +Darkzero and Easter Bunny for example. + +The selection of the colorset is done in a combination of a template for a new form in the settings and aome functions in the theme.php file. +The template (theme_settings.tpl) + + + {{include file="field_select.tpl" field=$colorset}} +
+ +
+ +defines a formular consisting of a [select](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select) pull-down which contains all aviable variants and s submit button. +See the documentation about [SMARTY3 templates](/help/snarty3-templates.md) for a summary of friendica specific blocks other then the select element. + +The template alone wont work. +You make friendica aware of its existance and tell it how to use the template file, by defining a config.php file. +It needs to define at lest the following functions +* theme_content +* theme_post + +and may also define functions for the admin interface + +* theme_admin +* theme_admin_post. + +theme_content and theme_admin are used to make the form available in the settings, repectively the admin panel. +The _post functions handle the processing of the send form, in this case they save to selected variand in friendicas database. + +To make your own variation all you need to do is to create a new CSS file in the deriv directoy and include it in the array in the config.php: + + $colorset = array( + 'default'=>t('default'), + 'greenzero'=>t('greenzero'), + 'purplezero'=>t('purplezero'), + 'easterbunny'=>t('easterbunny'), + 'darkzero'=>t('darkzero'), + 'comix'=>t('comix'), + 'slackr'=>t('slackr'), + ); + +the 1st part of the line is the name of the CSS file (without the .css) the 2nd part is the common name of the variant. +The selected 1st part will be saved in the database by the theme_post function. + + function theme_post(&$a){ + // non local users shall not pass + if(! local_user()) + return; + // if the one specific submit button was pressed then proceed + if (isset($_POST['duepuntozero-settings-submit'])){ + // and save the selection key into the personal config of the user + set_pconfig(local_user(), 'duepuntozero', 'colorset', $_POST['duepuntozero_colorset']); + } + } + +Now that this information is set in the databes, what should friendica do with it? +For this, have a look at the theme.php file of the theme. +There you'll find somethink alike + + $colorset = get_pconfig( local_user(), 'duepuntozero','colorset'); + if (!$colorset) + $colorset = get_config('duepuntozero', 'colorset'); + if ($colorset) { + if ($colorset == 'greenzero') + $a->page['htmlhead'] .= ''."\n"; + /* some more variants */ + } + +so you'll just need to add a if selection, fitting your variant keyword and link to the CSS file of it. + +Done. +Now you can use the variant on your system. +But remember once the theme.php or the config.php you have to readd your variant to them. + +*More of less the same procedure works for the vier theme.* + +### Inheritation + +Say, you like the duepuntozero but you want to have the content of the outer columns left and right exchanged. +That would be not a color variation as shown above. +Instead we will create a new theme, duepuntozero_lr, inherit the properties of duepuntozero and make small changes to the underlying php files. + +So create a directory called duepunto_lr and create a file called theme.php with your favorite text editor. +The content of this file should be something like + + theme_info = array( + 'extends' => 'duepuntozero'. + ); + set_template_engine($a, 'smarty3'); + /* and more stuff e.g. the JavaScript function for the header */ + } + +Next take the default.php file found in the /view direcotry and exchange the aside and right_aside elements. +So the central part of the file now looks like this: + + + + +
+ +
+ +
+ + +Finally we need a style.css file, inheriting the definitions from the parent theme and containing out changes for the new theme. + + @import url('../duepuntozero/style.css'); + +Done. +But I agree it is not really useful at this state. +Nevertheless, to use it, you just neet to activate in the admin panel. +That done, you can select it in the settings like any other activated theme. + +## Creating a Theme from Scratch + +Keep patient. +Basically what you have to do is identifying which template you have to change so it looks more like what you want. +Adopt the CSS of the theme accordingly. +And iterate the process until you have the theme the way you want it. + +## Special Files + +### unsupported + +If a file (which might be empty) exists in the theme directory, the theme is marked as *unsupported*. +An unsupported theme may not be selected by a user in the settings. +Users who are already using it wont notice anything. + +### README(.md) + +The contents of this file, with or without the .md which indicates [Markdown](https://daringfireball.net/projects/markdown/) syntax, will be displayed at most repository hosting services and in the theme page within the admin panel of friendica. + +This file should contain information you want to let others know about your theme. + +### screenshot.[png|jpg] + +If you want to have a preview image of your theme displayed in the settings you should take a screenshot and save it with this name. +Supported formats are PNG and JPEG. + +### theme.php + +This is the main definition file of the theme. +In the header of that file, some meta information are stored. +For example, have a look at the theme.php of the *quattro* theme: + + + * Maintainer: Fabio + * Maintainer: Tobias + */ + +You see the definition of the themes name, it's version and the initial author of the theme. +These three information should be listed. +If the original author is not anymore working on the theme, but a maintainer has taken over, the maintainer should be listed as well. +The information from the theme header will be displayed in the admin panelö. + +Next crucial part of the theme.php file is a definition of an init function. +The name of the function is _init. +So in the case of quattro it is + + function quattro_init(&$a) { + $a->theme_info = array(); + set_template_engine($a, 'smarty3'); + } + +Here we have set the basic theme information, in this case they are empthy. +But the array needs to be set. +And we have set the template engine that should be used by friendica for this theme. +At the moment you should use the *smarty3* engine. +There once was a friendica specific templating engine as well but that is not used anymore. +If you like to use another templating engine, please implement it. + +When you want to inherit stuff from another theme you have to *announce* this in the theme_info: + + $a->theme_info = array( + 'extends' => 'duepuntozero', + ); + +which declares *duepuntozero* as parent of the theme. + +If you want to add something to the HTML header of the theme, one way to do so is by adding it to the theme.php file. +To do so, add something alike + + $a->page['htmlhead'] .= <<< EOT + /* stuff you want to add to the header */ + EOT; + +The $a variable holds the friendica application. +So you can access the properties of this friendica session from the theme.php file as well. + +### default.php + +This file covers the structure of the underlying HTML layout. +The default file is in + + /view/default.php + +if you want to change it, say adding a 4th column for banners of your favourite FLOSS projects, place a new default.php file in your theme directory. \ No newline at end of file From 11dff64bc9370ce63f11192d4193fbc76ad8f62a Mon Sep 17 00:00:00 2001 From: Tobias Diekershoff Date: Sun, 16 Aug 2015 18:18:01 +0200 Subject: [PATCH 2/9] typo --- doc/themes.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/doc/themes.md b/doc/themes.md index 1e15b3df8..9500047e2 100644 --- a/doc/themes.md +++ b/doc/themes.md @@ -133,7 +133,7 @@ Done. Now you can use the variant on your system. But remember once the theme.php or the config.php you have to readd your variant to them. -*More of less the same procedure works for the vier theme.* +*More or less the same procedure works for the vier theme.* ### Inheritation @@ -263,4 +263,4 @@ The default file is in /view/default.php -if you want to change it, say adding a 4th column for banners of your favourite FLOSS projects, place a new default.php file in your theme directory. \ No newline at end of file +if you want to change it, say adding a 4th column for banners of your favourite FLOSS projects, place a new default.php file in your theme directory. From fbbb260dbbb5075bcc1865c689b2fd337a5a5381 Mon Sep 17 00:00:00 2001 From: Tobias Diekershoff Date: Mon, 17 Aug 2015 09:17:36 +0200 Subject: [PATCH 3/9] 2nd iteration of the theming docs --- doc/themes.md | 60 +++++++++++++++++++++++++++++++++++---------------- 1 file changed, 41 insertions(+), 19 deletions(-) diff --git a/doc/themes.md b/doc/themes.md index 9500047e2..03a6b447f 100644 --- a/doc/themes.md +++ b/doc/themes.md @@ -5,32 +5,37 @@ To change the look of friendica you have to touch the themes. The current default theme is [duepunto zero](https://github.com/friendica/friendica/tree/master/view/theme/duepuntozero) but there are numerous others. Have a look at [friendica-themes.com](http://friendica-themes.com) for an overview of the existing themes. -There are several ways to change a theme. +In case none of them suits your needs, there are several ways to change a theme. + You can either directly work on an existing theme. But you might loose your changes when the theme is updated by the friendica team. -In cases where you are almost happy with an existing theme, the easiest way to cover your needs is to create a new theme, inheritating most of the properties of the parent theme and change just minor stuff. + +If you are almost happy with an existing theme, the easiest way to cover your needs is to create a new theme, inheritating most of the properties of the parent theme and change just minor stuff. The beloow for a more detailed description of theme heritage. Some themes also allow users to select *variants* of the theme. Those theme variants most often contain an additional [CSS](https://en.wikipedia.org/wiki/CSS) file to override some styling of the default theme values. From the themes in the main repository *duepunto zero* and *vier* are using this methods for variations. +Quattro is using a slightly different approach. Third you can start your theme from scratch. Which is the most complex way to change friendicas look. But it leaves you the most freedom. -So below for a detailed description and the meaning of some special files. +So below for a *detailed* description and the meaning of some special files. -## Styling +### Styling If you want to change the styling of a theme, have a look at the themes CSS file. In most cases, you can found these in - /view/theme//style.css + /view/theme/**your-theme-name**/style.css sometimes, there is also a file called style.php in the theme directory. This is only needed if the theme allowes the user to change certain things of the theme dynamically. Say the font size or set a background image. +### Templates + If you want to change the structure of the theme, you need to change the templates used by the theme. Friendica themes are using [SMARTY3](http://www.smarty.net/) for templating. The default template can be found in @@ -39,20 +44,29 @@ The default template can be found in if you want to override any template within your theme create your version of the template in - /view/theme//templates + /view/theme/**your-theme-name**/templates any template that exists there will be used instead of the default one. + +### Javascript + The same rule applies to the JavaScript files found in /js they will be overwritten by files in - /view/theme//js. + /view/theme/**your-theme-name**/js. ## Expand an existing Theme -### A new Variation for duepuntozero +### Theme Variations + +Many themes are more *theme families* then only one theme. +*duepunto zero* and *vier* allow easily to add new theme variation. +We will go through the process of creating a new variation for *duepunto zero*. +The same (well almost, some names change) procedure applies to the *vier* theme. +And similar steps are needed for *quattro* but this theme is using [lessc](http://lesscss.org/#docs) to maintaine the CSS files.. In @@ -65,18 +79,19 @@ Darkzero and Easter Bunny for example. The selection of the colorset is done in a combination of a template for a new form in the settings and aome functions in the theme.php file. The template (theme_settings.tpl) - - {{include file="field_select.tpl" field=$colorset}} + {{include file="field_select.tpl" field=$colorset}}
defines a formular consisting of a [select](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select) pull-down which contains all aviable variants and s submit button. See the documentation about [SMARTY3 templates](/help/snarty3-templates.md) for a summary of friendica specific blocks other then the select element. +But we don't really need to change anything at the template itself. -The template alone wont work. +The template alone wont work though. You make friendica aware of its existance and tell it how to use the template file, by defining a config.php file. It needs to define at lest the following functions + * theme_content * theme_post @@ -88,10 +103,10 @@ and may also define functions for the admin interface theme_content and theme_admin are used to make the form available in the settings, repectively the admin panel. The _post functions handle the processing of the send form, in this case they save to selected variand in friendicas database. -To make your own variation all you need to do is to create a new CSS file in the deriv directoy and include it in the array in the config.php: +To make your own variation appear in the menu, all you need to do is to create a new CSS file in the deriv directoy and include it in the array in the config.php: $colorset = array( - 'default'=>t('default'), + 'default'=>t('default'), 'greenzero'=>t('greenzero'), 'purplezero'=>t('purplezero'), 'easterbunny'=>t('easterbunny'), @@ -101,6 +116,7 @@ To make your own variation all you need to do is to create a new CSS file in the ); the 1st part of the line is the name of the CSS file (without the .css) the 2nd part is the common name of the variant. +Calling the t() function with the common name makes the string translateable. The selected 1st part will be saved in the database by the theme_post function. function theme_post(&$a){ @@ -114,8 +130,8 @@ The selected 1st part will be saved in the database by the theme_post function. } } -Now that this information is set in the databes, what should friendica do with it? -For this, have a look at the theme.php file of the theme. +Now that this information is set in the database, what should friendica do with it? +For this, have a look at the theme.php file of the *duepunto zero*. There you'll find somethink alike $colorset = get_pconfig( local_user(), 'duepuntozero','colorset'); @@ -127,13 +143,15 @@ There you'll find somethink alike /* some more variants */ } -so you'll just need to add a if selection, fitting your variant keyword and link to the CSS file of it. +which tells friendica to get the personal config of a user. +Check if it is set and if not look for the global config. +And finally if a config for the colorset was found, apply it by adding a link to the CSS file into the HTML header of the page. +So you'll just need to add a if selection, fitting your variant keyword and link to the CSS file of it. Done. Now you can use the variant on your system. But remember once the theme.php or the config.php you have to readd your variant to them. - -*More or less the same procedure works for the vier theme.* +If you think your color variation could be benifical for other friendica users as well, feel free to generate a pull request at github so we can include your work into the repository. ### Inheritation @@ -168,12 +186,13 @@ So the central part of the file now looks like this: Finally we need a style.css file, inheriting the definitions from the parent theme and containing out changes for the new theme. +***Note***:You need to create the style.css and at lest import the base CSS file from the parent theme. @import url('../duepuntozero/style.css'); Done. But I agree it is not really useful at this state. -Nevertheless, to use it, you just neet to activate in the admin panel. +Nevertheless, to use it, you just need to activate in the admin panel. That done, you can select it in the settings like any other activated theme. ## Creating a Theme from Scratch @@ -183,6 +202,8 @@ Basically what you have to do is identifying which template you have to change s Adopt the CSS of the theme accordingly. And iterate the process until you have the theme the way you want it. +*Use the source Luke.* + ## Special Files ### unsupported @@ -264,3 +285,4 @@ The default file is in /view/default.php if you want to change it, say adding a 4th column for banners of your favourite FLOSS projects, place a new default.php file in your theme directory. +As with the theme.php file, you can use the properties of the $a variable with holds the friendica application to decide what content is displayed. \ No newline at end of file From 125021903c3d08b5052c892e492d21fbc1ab3b7a Mon Sep 17 00:00:00 2001 From: Tobias Diekershoff Date: Mon, 17 Aug 2015 09:23:11 +0200 Subject: [PATCH 4/9] updated the Home.md files for EN and DE --- doc/Home.md | 1 + doc/de/Home.md | 10 ++++++++++ 2 files changed, 11 insertions(+) diff --git a/doc/Home.md b/doc/Home.md index 1c293e4a5..d944dfb65 100644 --- a/doc/Home.md +++ b/doc/Home.md @@ -41,6 +41,7 @@ Friendica Documentation and Resources * [How to translate Friendica](help/translations) * [Bugs and Issues](help/Bugs-and-Issues) * [Plugin Development](help/Plugins) +* [Theme Development](help/themes) * [Smarty 3 Templates](help/smarty3-templates) **External Resources** diff --git a/doc/de/Home.md b/doc/de/Home.md index bc022a1a2..ee5fba64b 100644 --- a/doc/de/Home.md +++ b/doc/de/Home.md @@ -37,6 +37,16 @@ Friendica - Dokumentation und Ressourcen * [Twitter/StatusNet API Functions](help/api) (EN) * [Translation of Friendica](help/translations) (EN) +**Entwickler Dokumentation** + +* [Where to get started?](help/Developers-Intro) +* [Help on Github](help/Github) +* [Help on Vagrant](help/Vagrant) +* [How to translate Friendica](help/translations) +* [Bugs and Issues](help/Bugs-and-Issues) +* [Plugin Development](help/Plugins) +* [Theme Development](help/themes) +* [Smarty 3 Templates](help/smarty3-templates) **Externe Ressourcen** From 115156e8d287772fb07ffa9fd05093286d8f02c6 Mon Sep 17 00:00:00 2001 From: Tobias Diekershoff Date: Tue, 18 Aug 2015 09:33:03 +0200 Subject: [PATCH 5/9] added [spoiler] to the BBCode documentation --- doc/BBCode.md | 300 ++++++++++++++++++++++++----------------------- doc/de/BBCode.md | 254 ++++++++++++++++++++------------------- 2 files changed, 285 insertions(+), 269 deletions(-) diff --git a/doc/BBCode.md b/doc/BBCode.md index 7068f1691..fe7c1481f 100644 --- a/doc/BBCode.md +++ b/doc/BBCode.md @@ -1,146 +1,154 @@ -Friendica BBCode tags reference -======================== - -* [Home](help) - -Inline ------ - - -
[b]bold[/b]
: bold - -
[i]italic[/i]
: italic - -
[u]underlined[/u]
: underlined - -
[s]strike[/s]
: strike - -
[color=red]red[/color]
: red - -
[url=http://www.friendica.com]Friendica[/url]
: Friendica - -
[img]http://friendica.com/sites/default/files/friendika-32.png[/img]
: Immagine/foto - -
[size=xx-small]small text[/size]
: small text - -
[size=xx-large]big text[/size]
: big text - -
[size=20]exact size[/size] (size can be any number, in pixel)
: exact size - - - - - - - -Block ------ - -
[code]code[/code]
- -code - -

 

- -
[quote]quote[/quote]
- -
quote
- -

 

- -
[quote=Author]Author? Me? No, no, no...[/quote]
- -Author wrote:
Author? Me? No, no, no...
- -

 

- -
[center]centered text[/center]
- -
centered text
- -

 

- -**Table** -
[table border=1]
- [tr] 
-   [th]Tables now[/th]
- [/tr]
- [tr]
-   [td]Have headers[/td]
- [/tr]
-[/table]
- -
Tables now
Have headers
- -

 

- -**List** - -
[list]
- [*] First list element
- [*] Second list element
-[/list]
-
    -
  • First list element
    -
  • -
  • Second list element
  • -
- -[list] is equivalent to [ul] (unordered list). - -[ol] can be used instead of [list] to show an ordered list: - -
[ol]
- [*] First list element
- [*] Second list element
-[/ol]
-
  • First list element
  • Second list element
- -For more options on ordered lists, you can define the style of numeration on [list] argument: -
[list=1]
: decimal - -
[list=i]
: lover case roman - -
[list=I]
: upper case roman - -
[list=a]
: lover case alphabetic - -
[list=A] 
: upper case alphabetic - - - - -Embed ------- - -You can embed video, audio and more in a message. - -
[video]url[/video]
-
[audio]url[/audio]
- -Where *url* can be an url to youtube, vimeo, soundcloud, or other sites wich supports oembed or opengraph specifications. -*url* can be also full url to an ogg file. HTML5 tag will be used to show it. - -
[url]*url*[/url]
- -If *url* supports oembed or opengraph specifications the embedded object will be shown (eg, documents from scribd). -Page title with a link to *url* will be shown. - -Map ---- - -
[map]address[/map]
-
[map=lat,long]
- -You can embed maps from coordinates or addresses. -This require "openstreetmap" addon version 1.3 or newer. - - -Special -------- - -If you need to put literal bbcode in a message, [noparse], [nobb] or [pre] are used to escape bbcode: - -
[noparse][b]bold[/b][/noparse]
: [b]bold[/b] - - +Friendica BBCode tags reference +======================== + +* [Home](help) + +Inline +----- + + +
[b]bold[/b]
: bold + +
[i]italic[/i]
: italic + +
[u]underlined[/u]
: underlined + +
[s]strike[/s]
: strike + +
[color=red]red[/color]
: red + +
[url=http://www.friendica.com]Friendica[/url]
: Friendica + +
[img]http://friendica.com/sites/default/files/friendika-32.png[/img]
: Immagine/foto + +
[size=xx-small]small text[/size]
: small text + +
[size=xx-large]big text[/size]
: big text + +
[size=20]exact size[/size] (size can be any number, in pixel)
: exact size + + + + + + + +Block +----- + +
[code]code[/code]
+ +code + +

 

+ +
[quote]quote[/quote]
+ +
quote
+ +

 

+ +
[quote=Author]Author? Me? No, no, no...[/quote]
+ +Author wrote:
Author? Me? No, no, no...
+ +

 

+ +
[center]centered text[/center]
+ +
centered text
+ +

 

+ +
You should not read any further if you want to be surprised.[spoiler]There is a happy end.[/spoiler]
+ +You should not read any further if you want to be surprised.
*click to open/close* + +(The text between thhe opening and the closing of the spoiler tag will be visible once the link is clicked. So *"There is a happy end."* wont be visible until the spoiler is uncovered.) + +

 

+ +**Table** +
[table border=1]
+ [tr] 
+   [th]Tables now[/th]
+ [/tr]
+ [tr]
+   [td]Have headers[/td]
+ [/tr]
+[/table]
+ +
Tables now
Have headers
+ +

 

+ +**List** + +
[list]
+ [*] First list element
+ [*] Second list element
+[/list]
+
    +
  • First list element
    +
  • +
  • Second list element
  • +
+ +[list] is equivalent to [ul] (unordered list). + +[ol] can be used instead of [list] to show an ordered list: + +
[ol]
+ [*] First list element
+ [*] Second list element
+[/ol]
+
  • First list element
  • Second list element
+ +For more options on ordered lists, you can define the style of numeration on [list] argument: +
[list=1]
: decimal + +
[list=i]
: lover case roman + +
[list=I]
: upper case roman + +
[list=a]
: lover case alphabetic + +
[list=A] 
: upper case alphabetic + + + + +Embed +------ + +You can embed video, audio and more in a message. + +
[video]url[/video]
+
[audio]url[/audio]
+ +Where *url* can be an url to youtube, vimeo, soundcloud, or other sites wich supports oembed or opengraph specifications. +*url* can be also full url to an ogg file. HTML5 tag will be used to show it. + +
[url]*url*[/url]
+ +If *url* supports oembed or opengraph specifications the embedded object will be shown (eg, documents from scribd). +Page title with a link to *url* will be shown. + +Map +--- + +
[map]address[/map]
+
[map=lat,long]
+ +You can embed maps from coordinates or addresses. +This require "openstreetmap" addon version 1.3 or newer. + + +Special +------- + +If you need to put literal bbcode in a message, [noparse], [nobb] or [pre] are used to escape bbcode: + +
[noparse][b]bold[/b][/noparse]
: [b]bold[/b] + + diff --git a/doc/de/BBCode.md b/doc/de/BBCode.md index dc8bf85d5..971e6ffb6 100644 --- a/doc/de/BBCode.md +++ b/doc/de/BBCode.md @@ -1,139 +1,147 @@ Referenz der Friendica BBCode Tags -======================== - -* [Zur Startseite der Hilfe](help) - -Inline Tags ------ - - +======================== + +* [Zur Startseite der Hilfe](help) + +Inline Tags +----- + +
[b]fett[/b]
: fett - +
[i]kursiv[/i]
: kursiv - +
[u]unterstrichen[/u]
: unterstrichen - +
[s]durchgestrichen[/s]
: durchgestrichen - +
[color=red]rot[/color]
: rot - +
[url=http://www.friendica.com]Friendica[/url]
: Friendica - +
[img]http://friendica.com/sites/default/files/friendika-32.png[/img]
: Immagine/foto - +
[size=xx-small]kleiner Text[/size]
: kleiner Text - +
[size=xx-large]groß Text[/size]
: großer Text - +
[size=20]exakte Textgröße[/size] (Textgröße kann jede Zahl sein, in Pixeln)
: exakte Größe - - - - - - - -Block Tags ------ - -
[code]Code[/code]
- -Code - -

 

- -
[quote]Zitat[/quote]
- -
Zitat
- -

 

- -
[quote=Autor]Der Autor? Ich? Nein, nein, nein...[/quote]
- -Autor hat geschrieben:
Der Autor? Ich? Nein, nein, nein...
- -

 

- -
[center]zentrierter Text[/center]
- -
zentrierter Text
- -

 

- -**Tabelle** -
[table border=1]
- [tr] 
-   [th]Tabellenzeile[/th]
- [/tr]
- [tr]
-   [td]haben Überschriften[/td]
- [/tr]
-[/table]
- -
Tabellenzeile
haben Überschriften
- -

 

- -**Listen** - -
[list]
- [*] Erstes Listenelement
- [*] Zweites Listenelement
-[/list]
-
    -
  • Erstes Listenelement
    -
  • -
  • Zweites Listenelement
  • -
- -[list] ist Equivalent zu [ul] (unsortierte Liste). - -[ol] kann anstelle von [list] verwendet werden um eine sortierte Liste zu erzeugen: - -
[ol]
- [*] Erstes Listenelement
- [*] Zweites Listenelement
-[/ol]
-
  • Erstes Listenelement
  • Zweites Listenelement
- -Für weitere Optionen von sortierten Listen kann man den Stil der Numerierung der Liste definieren: -
[list=1]
: dezimal - -
[list=i]
: römisch, Kleinbuchstaben - -
[list=I]
: römisch, Großbuchstaben - -
[list=a]
: alphabetisch, Kleinbuchstaben - -
[list=A] 
: alphabethisch, Großbuchstaben - - - - -Einbettung von Inhalten ------- - -Man kann viele Dinge, z.B. Video und Audio Dateine, in Nachrichten einbetten. - -
[video]url[/video]
-
[audio]url[/audio]
- -Wobei die *url* von youtube, vimeo, soundcloud oder einer anderen Seite stammen kann die die oembed oder opengraph Spezifikationen unterstützt. + + + + + + + +Block Tags +----- + +
[code]Code[/code]
+ +Code + +

 

+ +
[quote]Zitat[/quote]
+ +
Zitat
+ +

 

+ +
[quote=Autor]Der Autor? Ich? Nein, nein, nein...[/quote]
+ +Autor hat geschrieben:
Der Autor? Ich? Nein, nein, nein...
+ +

 

+ +
[center]zentrierter Text[/center]
+ +
zentrierter Text
+ +

 

+ +
Wer überrascht werden möchte sollte nicht weiter lesen.[spoiler]Es gibt ein Happy End.[/spoiler]
+ +Wer überrascht werden möchte sollte nicht weiter lesen.
*klicken zum öffnen/schließen* + +(Der Text zweischen dem öffnenden und dem schließenden Teil des spoiler Tags wird nicht angezeigt, bis der Link angeklickt wurde. In dem Fall wird *"Es gibt ein Happy End."* also erst angezeigt, wenn der Spoiler verraten wird.) + +

 

+ +**Tabelle** +
[table border=1]
+ [tr] 
+   [th]Tabellenzeile[/th]
+ [/tr]
+ [tr]
+   [td]haben Überschriften[/td]
+ [/tr]
+[/table]
+ +
Tabellenzeile
haben Überschriften
+ +

 

+ +**Listen** + +
[list]
+ [*] Erstes Listenelement
+ [*] Zweites Listenelement
+[/list]
+
    +
  • Erstes Listenelement
    +
  • +
  • Zweites Listenelement
  • +
+ +[list] ist Equivalent zu [ul] (unsortierte Liste). + +[ol] kann anstelle von [list] verwendet werden um eine sortierte Liste zu erzeugen: + +
[ol]
+ [*] Erstes Listenelement
+ [*] Zweites Listenelement
+[/ol]
+
  • Erstes Listenelement
  • Zweites Listenelement
+ +Für weitere Optionen von sortierten Listen kann man den Stil der Numerierung der Liste definieren: +
[list=1]
: dezimal + +
[list=i]
: römisch, Kleinbuchstaben + +
[list=I]
: römisch, Großbuchstaben + +
[list=a]
: alphabetisch, Kleinbuchstaben + +
[list=A] 
: alphabethisch, Großbuchstaben + + + + +Einbettung von Inhalten +------ + +Man kann viele Dinge, z.B. Video und Audio Dateine, in Nachrichten einbetten. + +
[video]url[/video]
+
[audio]url[/audio]
+ +Wobei die *url* von youtube, vimeo, soundcloud oder einer anderen Seite stammen kann die die oembed oder opengraph Spezifikationen unterstützt. Außerdem kann *url* die genaue url zu einer ogg Datei sein, die dann per HTML5 eingebunden wird. - -
[url]*url*[/url]
- + +
[url]*url*[/url]
+ Wenn *url* entweder oembed oder opengraph unterstützt wird das eingebettete Objekt (z.B. ein Dokument von scribd) eingebunden. Der Titel der Seite mit einem Link zur *url* wird ebenfalls angezeigt. - - - -Spezielle Tags -------- - + + + +Spezielle Tags +------- + Wenn Du über BBCode Tags in einer Nachricht schreiben möchtest, kannst Du [noparse], [nobb] oder [pre] verwenden um den BBCode Tags vor der Evaluierung zu schützen: - -
[noparse][b]fett[/b][/noparse]
: [b]fett[/b] - - + +
[noparse][b]fett[/b][/noparse]
: [b]fett[/b] + + From eb895274a779efd175188ca9b7b7a2ee24bb24a3 Mon Sep 17 00:00:00 2001 From: Tobias Diekershoff Date: Tue, 18 Aug 2015 10:02:33 +0200 Subject: [PATCH 6/9] 3rd iteration over the theme docs --- doc/themes.md | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) diff --git a/doc/themes.md b/doc/themes.md index 03a6b447f..add44c776 100644 --- a/doc/themes.md +++ b/doc/themes.md @@ -6,12 +6,15 @@ To change the look of friendica you have to touch the themes. The current default theme is [duepunto zero](https://github.com/friendica/friendica/tree/master/view/theme/duepuntozero) but there are numerous others. Have a look at [friendica-themes.com](http://friendica-themes.com) for an overview of the existing themes. In case none of them suits your needs, there are several ways to change a theme. +If you need help theming, there is a forum @[ftdevs@friendica.eu](https://friendica.eu/profile/ftdevs) where you can ask theme specific questions and present your themes. -You can either directly work on an existing theme. +So, how to work on the UI of friendica. + +You can either directly edit an existing theme. But you might loose your changes when the theme is updated by the friendica team. If you are almost happy with an existing theme, the easiest way to cover your needs is to create a new theme, inheritating most of the properties of the parent theme and change just minor stuff. -The beloow for a more detailed description of theme heritage. +The below for a more detailed description of theme heritage. Some themes also allow users to select *variants* of the theme. Those theme variants most often contain an additional [CSS](https://en.wikipedia.org/wiki/CSS) file to override some styling of the default theme values. @@ -202,13 +205,13 @@ Basically what you have to do is identifying which template you have to change s Adopt the CSS of the theme accordingly. And iterate the process until you have the theme the way you want it. -*Use the source Luke.* +*Use the source Luke.* and don't hesitate to ask in @[ftdevs](https://friendica.eu/profile/ftdevs) or @[helpers](https://helpers.pyxis.uberspace.de/profile/helpers). ## Special Files ### unsupported -If a file (which might be empty) exists in the theme directory, the theme is marked as *unsupported*. +If a file with this name (which might be empty) exists in the theme directory, the theme is marked as *unsupported*. An unsupported theme may not be selected by a user in the settings. Users who are already using it wont notice anything. From 977b7f6a8772661c28e0f341ed635b57ba747249 Mon Sep 17 00:00:00 2001 From: Tobias Diekershoff Date: Tue, 18 Aug 2015 12:39:38 +0200 Subject: [PATCH 7/9] added description of the [map] tag to the DE bbcode docs --- doc/de/BBCode.md | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/doc/de/BBCode.md b/doc/de/BBCode.md index 971e6ffb6..d3e205f0f 100644 --- a/doc/de/BBCode.md +++ b/doc/de/BBCode.md @@ -126,7 +126,7 @@ Man kann viele Dinge, z.B. Video und Audio Dateine, in Nachrichten einbetten.
[video]url[/video]
[audio]url[/audio]
-Wobei die *url* von youtube, vimeo, soundcloud oder einer anderen Seite stammen kann die die oembed oder opengraph Spezifikationen unterstützt. +Wobei die *url* von youtube, vimeo, soundcloud oder einer anderen Seite stammen kann die die oembed oder opengraph Spezifikationen unterstützt. Außerdem kann *url* die genaue url zu einer ogg Datei sein, die dann per HTML5 eingebunden wird.
[url]*url*[/url]
@@ -135,7 +135,15 @@ Wenn *url* entweder oembed oder opengraph unterstützt wird das eingebettete Objekt (z.B. ein Dokument von scribd) eingebunden. Der Titel der Seite mit einem Link zur *url* wird ebenfalls angezeigt. +Um eine Karte in einen Beitrag einzubinden, muss das *openstreetmap* Addon aktiviert werden. Ist dies der Fall, kann mit +
[map]Broadway 26, New York[/map]
+ +eine Karte von [OpenStreetmap](http://openstreetmap.org) eingebettet werden. Zur Identifikation des Ortes können entweder seine Koordinaten in der Form + +
[map=lat,long]
+ +oder eine Adresse in obiger Form verwendet werden. Spezielle Tags ------- From 319b8225f4eb4aa7f1e18d1e7e7ce97c34699436 Mon Sep 17 00:00:00 2001 From: Tobias Diekershoff Date: Tue, 18 Aug 2015 18:07:59 +0200 Subject: [PATCH 8/9] a doc file for the event page --- doc/Home.md | 1 + doc/de/Home.md | 1 + doc/events.md | 58 ++++++++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 60 insertions(+) create mode 100644 doc/events.md diff --git a/doc/Home.md b/doc/Home.md index d944dfb65..78d52599f 100644 --- a/doc/Home.md +++ b/doc/Home.md @@ -11,6 +11,7 @@ Friendica Documentation and Resources * [Comment, sort and delete posts](help/Text_comment) * [Profiles](help/Profiles) * [Accesskey reference](help/Accesskeys + * [Events](help/events) * You and other users * [Connectors](help/Connectors) * [Making Friends](help/Making-Friends) diff --git a/doc/de/Home.md b/doc/de/Home.md index ee5fba64b..b9438a891 100644 --- a/doc/de/Home.md +++ b/doc/de/Home.md @@ -11,6 +11,7 @@ Friendica - Dokumentation und Ressourcen * [Beiträge kommentieren, einordnen und löschen](help/Text_comment) * [Profile](help/Profiles) * [Referenz der Accesskeys](help/Accesskeys) + * [Veranstaltungen](help/events) (EN) * Du und andere Nutzer * [Konnektoren (Connectors)](help/Connectors) * [Freunde finden](help/Making-Friends) diff --git a/doc/events.md b/doc/events.md new file mode 100644 index 000000000..a991c7995 --- /dev/null +++ b/doc/events.md @@ -0,0 +1,58 @@ +# Events + +* [Home](help) + +A special form of postings are events. +The events you and your contacts share can be found at [/events](/events) on your node. +To get there go to your wall and follow the tab "events" +Depending on the theme you are using, there might be an additional link from the navigation menu to this page. + +## Event Overview + +The overview page shows the calendar of the current month, plus eventually some days in the beginning and the end. +Listed are all events for this month you created, or your contacts have shared with you. +This includes birthday reminders for contacts who share their birthday with you. + +From the controls, you can switch between month/week/day view. +Flip through the view forwards and backwards. +And return to *today*. + +To create a new event, you can either follow the link "Create New Event" or make a double click on the desired box in the calendarium for when the event should take place. + +## Create a new Event + +Following one of the methods mentioned above you reach a form to enter the event data. +Fields marked with a *** have to be filled. + +* **Event Starts**: enter the date/time of the start of the event here +* **Event Finishes**: enter the finishing date/time for the event here + +When you click in one of these fields a pop-up will be opened that allows you to pick the day and the time. +If you double clicked on the day box in the calendarium these fields will be pre-filled for you. +The finishing date/time has to be after the beginning date/time of the event. +But you don't have to specify it. +If the event is open-end or the finishing date/time does not matter, just select the box below the two first fields. + +* **Adjust for viewer timezone**: If you check this box, the beginning and finisching times will automatically converted to the local time according to the timezone setting + +This might prevent too early birthday wishes, or the panic attac that you have forgotten the birthday from your buddy at the other end of the world. +And similar events. + +* **Title**: a title for the event +* **Description**: a longer description for the event +* **Location**: the location the event will took place + +These three fields describe your events. +In the descirption and location field you can use BBCode to format the text. + +* **Share this event**: when this box is checked the ACL will be shown to let you select with whom you wish to share the event. This works just like the controls of any other posting. + +When you *Share* the event it will be posted to your wall with the access permissions you've selected. +But before you do, you can also *preview* the event in a pop-up box. + +### Addons + +#### OpenStreetMap + +If this addon is activated on you friendica node, the content of the location field will be mathced with the identification service of OSM when you submit the event. +Should OSM find anything matching, a map for the location will be embedded automatically at the end of the events view. \ No newline at end of file From faf970523a01cd6451d5da1bf5d1b4c5467b0880 Mon Sep 17 00:00:00 2001 From: Tobias Diekershoff Date: Tue, 18 Aug 2015 18:17:16 +0200 Subject: [PATCH 9/9] what happens when an event is clicked? --- doc/events.md | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/doc/events.md b/doc/events.md index a991c7995..abb457687 100644 --- a/doc/events.md +++ b/doc/events.md @@ -19,6 +19,9 @@ And return to *today*. To create a new event, you can either follow the link "Create New Event" or make a double click on the desired box in the calendarium for when the event should take place. +With a click on an existing event a pop-up box will be opened which shows you the event. +From there you can edit the event or view the event at the source link, if you are the one who created the event. + ## Create a new Event Following one of the methods mentioned above you reach a form to enter the event data. @@ -55,4 +58,4 @@ But before you do, you can also *preview* the event in a pop-up box. #### OpenStreetMap If this addon is activated on you friendica node, the content of the location field will be mathced with the identification service of OSM when you submit the event. -Should OSM find anything matching, a map for the location will be embedded automatically at the end of the events view. \ No newline at end of file +Should OSM find anything matching, a map for the location will be embedded automatically at the end of the events view.