Starting with webEdition

ivelioski · Beitragvon **ivelioski** » So 6. Jan 2019, 20:04

hello guys,

I'm one new user of this, I just install webEdition 8.0.5 on localhost and for now, I'm 0 knowledge.
have any English tutorial for beginners or something?
Here in the attachment is a screen of my dashboard how it looks clear

: 11.PNG (164.27 KiB) 1081 mal betrachtet

So let me know if any have a good tutorial for starting of all

rhorbas · Beitragvon **rhorbas** » Mo 7. Jan 2019, 10:23

Hi Ivo,

glad You found Your way here!

I'll use the opportunity to maybe widen the non-german speaking user base a bit. Here goes:

What You get with webEdition is a completely empty system -- no templates, to theming, nothing. Everything is up to You and Your skills: A basic knowledge of HTML and CSS is essential. PHP is nice to have, but not necessary.

Let's start with the most basic template for a page -- that's the one You get when You use the menu: "New -> Template":

Code: Alles auswählen

<!DOCTYPE HTML>
<html dir="ltr" lang="<we:pageLanguage type="language" doc="top" />">
<head>
	<we:title></we:title>
	<we:description></we:description>
	<we:keywords></we:keywords>
	<we:charset defined="UTF-8">UTF-8</we:charset>
</head>
<body>
	<!-- webEdition demo template (8.0.5.0) -->
	<article style="width:400px">
		<h1><we:input type="text" name="Headline" style="width:60em"/></h1>
		<p><b><we:input type="date" name="Date" currentdate="true" format="d.m.Y"/></b></p>
		<we:ifNotEmpty name="Image">
			<p><we:img name="Image" showthumbcontrol="true"/></p>
		</we:ifNotEmpty>
		<we:textarea name="Content" width="400" height="400" wysiwyg="true" removefirstparagraph="false" inlineedit="true"/>
	</article>
</body>
</html>

webEdition has a template language that mixes nicely with HTML. All tags start with <we: /> and must be properly formed: Some are self-closing, and some need a closing tag:

Code: Alles auswählen

<we:input .../>
<we:a ...>...</we:a>

The starter template above has these WE-tags:

we:pageLanguage
we:title
we:description
we:keywords
we:charset
we:input
we:input type="text"
we:input type="date"
we:ifNotEmpty
we:img
we:textarea

Most of these You'll come across all the time, they are either basic data types or control structures (we:ifNotEmpty). Together with the we:block-Element, You already have a good toolbox to build a complete website!

Here's another very simple template with some more tags -- I've commented them in their comment-attributes where necessary:

Code: Alles auswählen

<!doctype html>
<html lang="<we:pageLanguage type="language" doc="top" />">
    <head>
        <we:charset defined="UTF-8">UTF-8</we:charset>
        <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <we:title></we:title>
        <we:description></we:description>
        <we:keywords></we:keywords>
        <we:css id="123" comment="inserts a css-stylesheet with the WE-ID 123" />
        <we:js id="124" comment="inserts a javascript with the WE-ID 124" />
    </head>
<body>

    <we:ifEditmode comment="This is only visible for backend users">
        <b>Headline:</b><br>
        <we:input type="text" name="headline" size="50"/><br>
        <b>Introduction (Text only)</b><br>

        <b>Image:</b><br>
        <we:img name="image" /><br>

        <we:textarea wysiwyg="false" name="teaser" cols="20" rows="10" width="600" height="100"  /><br>

        <we:block name="content" comment="the block element repeats everything in it, like a loop">

            <b>Subheading</b><br>
            <we:input type="text" name="subheading" size="50"/><br>

            <b>Another image:</b><br>
            <we:img name="image_in_block" /><br>

            <b>Formatted text:</b><br>
            <we:textarea wysiwyg="true" name="text" cols="20" rows="10" width="800" height="400" removefirstparagraph="false" inlineedit="true" />

        </we:block>
    </we:ifEditmode>

    <we:ifNotEditmode comment="This is visible for visitors">
        <h1>
            <we:input type="text" name="headline" comment="see how you can omit the size attribute? Only type and name are necessary!"/>
        </h1>

        <we:ifNotEmpty name="image" type="image">
            <we:img name="image"/>
        </we:ifNotEmpty>

        <we:ifNotEmpty name="teaser" comment="if the teaser is empty, the p.teaser-element is not displayed">
            <p class="teaser">
                <we:textarea name="teaser" comment="This is only text"/>
            </p>
        </we:ifNotEmpty>

        <we:block name="content">

            <we:ifNotEmpty name="subheading" comment="if the subheading is empty, no h2 is displayed!">
                <h2>
                    <we:input type="text" name="subheading"/>
                </h2>
            </we:ifNotEmpty>

            <we:ifNotEmpty name="image_in_block" type="image">
                <we:img name="image"/>
            </we:ifNotEmpty>

            <we:textarea wysiwyg="true" name="text" comment="Here comes a HTML textfield" />

        </we:block>

    </we:ifNotEditmode>

    </body>
</html>

That's a single page. Save the template as "Page.tmpl" (for example). Then use New -> Document -> webEdition Document and select this Template as the document's template. Play around with it a little bit, and make several documents with it.
Then we'll make a list of these pages in the next step!

rhorbas · Beitragvon **rhorbas** » Mo 7. Jan 2019, 11:31

I have some time at the moment, so I'll start right now. First, to avoid duplicate code, we define a main template for Your site:

Code: Alles auswählen

<!doctype html>
<html lang="<we:pageLanguage type="language" doc="top" />">
    <head>
        <we:charset defined="UTF-8">UTF-8</we:charset>
        <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <we:title></we:title>
        <we:description></we:description>
        <we:keywords></we:keywords>
        <we:css id="123" comment="inserts a css-stylesheet with the WE-ID 123" />
        <we:js id="124" comment="inserts a javascript with the WE-ID 124" />
    </head>
<body>

    <we:content />

    </body>
</html>

Save this template as Main.tmpl (for example). Then, whenever You make a new template, You just give that template this one as main (parent) template. Where You find <we:content />, the contents of the detail template are displayed. (Whenever You change the main template now, webEdition asks You now whether it should rebuild the child templates.)

If You need to fill other sections in the page, use the <we:master>- and <we:content>-tag:

Main.tmpl:

Code: Alles auswählen

<we:content name="preheader"/><!doctype html>
<html lang="<we:pageLanguage type="language" doc="top" />">
    <head>
        <we:content name="html_header"/>
    </head>
<body>

    <we:content />

    <we:content name="body_end"/>

    </body>
</html>

And Page.tmpl:

Code: Alles auswählen

<!-- This is displayed in we:content -->
Whatever
<!-- // This is displayed in we:content -->

<!-- These are displayed in  the we:content-sections with names -->
<we:master name="preheader"><?php // You could set a http-Header here! ?></we:master>
<we:master name="html_header">
    <style>
        /* Set individual CSS-Styles fpor this template only! */
    </style>
</we:master>
<we:master name="body_end">
    <script>
        /* This JavaScript is only included in this template  */
    </script>
</we:master>

rhorbas · Beitragvon **rhorbas** » Mo 7. Jan 2019, 11:45

OK, now let's define Your document types: In menu "Preferences", choose "Document Types"***

Create a new one, call it "Standard Page" (for example) and enter Your template "Page.tmpl"

In Defaults, also choose this template (a document type may have several different templates) and as extension, choose ".php" and "dynamic". You can also set a default directory and language, just try it!

After You have saved, when You go Menu -> New -> webEdition Page, You find Your new document type there.

*** I don't have webEdition in English, some menu items or backend names may have slightly different names, 'I'm just guessing!

rhorbas · Beitragvon **rhorbas** » Mo 7. Jan 2019, 11:52

And here's how You make a list of documents:

Code: Alles auswählen


<ul>
    <we:listview type="document" order="we_published" desc="true" rows="10">
        <we:repeat>
            <li>
                <b><we:field name="headline" alt="we_title" hyperlink="true"/></b><br>
                <we:ifFieldNotEmpty name="image" type="img">
                    <we:field type="img" name="image" /><br>
                </we:ifFieldNotEmpty>
                <we:field type="text" name="teaser" hyperlink="true" alt="description" max="255" striphtml="true" />
            </li>
        </we:repeat>
        <we:ifBack>
            <we:back>Back</we:back>
        </we:ifBack>
        <we:ifNext>
            <we:next>Next</we:next>
        </we:ifNext>
    </we:listview>
</ul>

This shows 10 page-headings, teasers and images (if used), ordered by publication date descending. If there are more than 10 results, a link is shown to go to the next 10 results. Easy, right?

rhorbas · Beitragvon **rhorbas** » Do 7. Feb 2019, 16:30

Looks like ivelioski lost interest; shame.

If there's anyone else interested in a "beginner's course" in English, go ahead and ask!

WBTMagnum · Beitragvon **WBTMagnum** » Do 7. Feb 2019, 21:44

Hey rhorbas,

If you're interested, it might be interesting to add the infos you prepared to the english wiki pages. I they could be a good starting point for others.

Cheers,
Sascha

rhorbas · Beitragvon **rhorbas** » Fr 8. Feb 2019, 11:59

Hi Sascha,

good idea, I even have an account there! (that I had to reactivate)

Said & done:
http://documentation.webedition.org/wik ... ners-guide

WBTMagnum · Beitragvon **WBTMagnum** » Sa 9. Feb 2019, 23:29

Hey rhorbas,

Great work. I went over it and applied some changes.

Cheers,
Sascha

webEdition - Forum

Starting with webEdition

Starting with webEdition

Re: Starting with webEdition

Re: Starting with webEdition

Re: Starting with webEdition

Re: Starting with webEdition

Re: Starting with webEdition

Re: Starting with webEdition

Re: Starting with webEdition

Re: Starting with webEdition

Wer ist online?