Utskriftsvennlig versjon

Bruk av Hash Templates

Hash Template felter benyttes for å flette inn verdier fra objekter inn i teksten i sidene dine. Eksempler er egendefinert forhåndsvisningsmal, egendefinerte lister og e-postmaler.

Hva er hash templates

Hash templates er visningsmalene for esite. Med bruk av hash templates kan du skreddersy hvordan esite skal presentere dine data i nettstedet ditt.

Ved å benytte #feltnavn# angivelser i teksten kan man flette inn verdier fra objekter. Hvilke objekter som flettes inn vil variere mellom funksjoner.

Hash templates har forkortelsen HTML# i esite.

Formatering av datofelter

Eksempel:

Her vises datoen: #Date."dd.MM.yy"#

Parametere (OBS! Case sensitiv!):
  • d - dag 1 siffer
  • dd - dag 2 siffer (01, 02, 03 osv)
  • M - måned 1 siffer
  • MM - måned 2 siffer (01, 02, 03 osv)
  • yy - År 2 siffer
  • yyyy - år 5 siffer
  • m - minutt 1 siffer
  • mm - minutt 2 siffer
  • h - time med 12 timers klokke (0-12)
  • hh - time 2 siffer med 12 timers klokke (00-12)
  • H - time med 24 timers klokke (0-24)
  • HH - time 2 siffer med 24 timers klokke (00-24)

Formatering av tall

Eksempel:

Her vises et tall: #tall.N#
Og her samme tallet i annet format: #tall."0.000"# 

Parametere:

  • N - tusenskille (1,054.32)
  • F - 2 desimaler (1054.32)
  • "0.0" - viser alltid med et desimaltall
  • "0.00" - viser alltid med to desimaltall
  • "0.000" - viser alltid med tre desimaltall
  • osv..
  • "000.00" - viser alltid med to siffer før komma og deretter 2 desimaltall"
  • osv.

Ekstra symboler

Dersom man ønsker å legge til ekstra symboler før eller etter tallet og mellom heltallet og desimaltallet kan man benytte \ tegnet før man oppgir symbolet man vil ha inn. Eksempler er:

  • #feltnavn."0\,\-"# vil vise tall som typiske priser uten desimaler. Eks: 100,-
  • #feltnavn."\k\r\. 0.00"# vil vise tall alltid med 2 desimaler og med kr. foran. Eks: kr. 100,50
  • Tusen skille: #feltnavn."##,######"#
  • Tusen skille med ,- bak: #feltnavn."##,######\,\-"#

Formatering / enkoding av tekst

Eksempler:

Url-enkoding:  #displayurl#?p=#param.urlencode#
Html-enkoding:  #displayurl.htmlencode#
Attributt-enkoding:  <a href="#displayurl.attribencode#">....</a>

Url-enkoding

Benyttes dersom spesialtegn skal kodes fra tekst inn i en url parameter.

Html-enkoding

Benyttes dersom symboler som kan tolkes av nettleser som html tags skal vises i nettside innholdet.

Attributt-enkoding

Brukes dersom tekstverdier med symboler skal legges inn i attributter som f.eks. url i lenker til sider eller filer.

Betingelser for malområder (Template Conditions)

Eksempel:

#[image]#
<img src="#image#" alt="#alttitle#" />
#[/image]#

For å sjekke at feltet ikke eksiterer eller har verdi benytt ! operatoren foran kriteriet:

#[!image]#
Har ikke bilde
#[/!image]#

Eksemplet viser en betingelsesdefinisjon med innhold. I blått er betingelsen om at image må ha en verdi og innen for betingelsesområdet ligger tekst som skal legges til dersom betingelsen er tilfredstilt. Her vil "<img ... />" tagget legges inn i resultatet dersom "image" feltet har en verdi.

Flere eksempler:

#[type="test"]#
<img src="#image#" alt="#alttitle#" />
#[/type="test"]#

OBS! < må skrives som &lt; i html kode. Redigerer du direkte i WYSIWYG editoren skriver du <

#[type&lt;"test"]#
<img src="#image#" alt="#alttitle#" />
#[/type&lt;"test"]#

Man kan også benytte ' istedet for " i verdiangivelser.
Dette er f.eks. nyttig inne i html attributter hvor " lager ugyldig html.
OBS! Tinymce kan lage noen problemer hvis den bytter ut ' med &# tegnkode.

<div style="#[type<'test']#display:none#[/type<'test']#">
Tekstinnhold eller annet
</div>

Symbolet > må skrives som &gt i html kode men ikke i WYSIWYG

#[type&gt;annetfelt]#
<img src="#image#" alt="#alttitle#" />
#[/type&gt;annetfelt]#

Eksemplene viser syntax for sjekking med operatorer. Gyldige operatorer:

  • <>  ikke lik
  • != ikke lik (samme som over)
  • = lik
  • > mer enn
  • < mindre enn
  • >= mere eller lik  (=> også godtatt)
  • <= mindre eller lik (=< også godtatt)
Operatorer for tekstinnhold:
  • ~= verdien inneholder teksten - ikke case sensitiv
  • ^= verdien inneholder teksten - case sensitiv
  • ~! verdien inneholder ikke teksten - ikke case sensitiv
  • ^! verdien inneholder ikke teksten - case sensitiv

OBS! Husk alltid " eller ' rundt konstantverdier i kriterier! Også for tall!

Loop av children objekter, mapper og arrays

Fletting av arrays kan gjøres ved å legge inn <table> eller <div> tags med data attributt. Dette gjøres eksempelvis av egendefinert liste, ved bruk av "children" som verdi for data attributtet, altså:

<table data-loop="children"><tbody><tr><td>......</td></tr></tbody></table>

For <div> tags gjelder følgende oppsett:

<div data-loop="children"><div>.......</div></div>

Underliggende objekter i strukturen flettes inn i hver sin rad. Ligger det flere tags under <tbody> (påkrevet for table) eller <div> tagget vil disse rulleres. Dette brukes for å gi kan gi en vekselvis formatering, som annenhver lys/mørk bakgrunn.Tekst i grønt i eksemplene vil gjentas og flettes.

_list_index - Gir elementnummer er et (nullindeksert). Eksempel som viser tittel for kun de 10 første elementene:

[_list_index."000"<"010"]<div>Element: #title#</div>[/_list_index."000"<"010"]

Verdt å merke seg her er at det er en string compare som benyttes. ."000" konverterer tall til å alltid ha med 3 siffer. Sammenligning på tall er ikke støttet.

Filer i mappe

Loope igjennom alle filer: 

<ul data-loop="images_folder">
<li>#file#</li>
</ul>

Loope igjennom alle bilder og lage lenker til filene:

<div data-loop="images_folder.images">
<div><a href="#file#">#Name# Bytes: #length#</div>
</div>

Loope igjennom filer basert på wildcard:

<div data-loop="images_folder.'*.pdf'">.......</div>

Loope igjennom underliggende mapper:

<div data-loop="images_folder.folders">
Path: #path# <br />
File count: #filecount#<br />
Sub dir count: #dircount#
</div>

Flere filtyper er også mulig å angi:

<div data-loop="images_folder.'*.pdf;*.doc;*.docx'">.......</div>

Se eksempel her

Felter i filobjekter:

  • #File# - Full path til fil
  • #Name# - Filnavn
  • #Directory# - Mappenavn
  • #Extension# - Filtype
  • #LastWriteTime# - Sist endret
  • #CreationTime# - Opprettet
  • #Length# - Størrelse i bytes

Tekstlinjer i tekstfelter

Memotekstfelter kan loopes, hver linje vil da komme som et element. Se eksemplet under:

<div data-loop="memofelt">
<div>#text#</div>
</div>

Loop i loop

Det er fullt mulig å ha looper kjørende innenfor andre overordnede looper. Se eksemplet under:

<div data-loop="users">
<div>Bruker med navn: #name#</div> <!-- Brukernavn -->
<div>Har redigeringstilgang til følgende mapper:</div>
<ul data-loop="editor">
<li>#name#</li> <!-- Mappenavn -->
</ul>
</div>

Rekursiv loop

<div data-loop="Elements">
<h2>#Title#</h2>
<span>#Content#</span>
<blockquote data-loop="Elements" data-template="{current}"></blockquote>
</div>

Felter med Hash Template editor

Felter med template editor gjør det enkelt å finne frem og legge til felter i malen. Dette gjøres eksempelvis i egen definert liste objektet samt e-postmaler for ordrebekreftelse i E-Site Shop. Her et bilde fra egenedfinert liste.

Felter med Hash Template editor

Hvordan finne navn på felter i objekter

Ved oppsett av maler hvor Template Editoren kan hjelpe deg å finne og legge til feltnavn kan utvikler verktøyene være til hjelp. Under utvikler knappen finner du "Vis verdier" valget som viser verdiene for de forskjellige objekter.

Hvordan finne navn på felter i objekter

Functions / funksjoner i hash templates

Template / page

  • Load(string) - Load a user control (ascx file)
  • Load(integer objectid, string mode) - Load an esite object in specified mode. Example 123, "resource_display".
  • Link(string) - Loads a hash template by id or name
  • Redirect(url) - Redirects to a page
  • Invoke(string methodname, param1, param2...) - Calls a method on object and returns value
  • ResolveUrl(string) - Resolves specified relative url to an absolute url.
  • AddMeta(property,content) - Adds / overwrites meta property header to the "head" element in page.

Image scaling

  • GetPreview(string) - Get url to preview scaled image from specified image file
  • GetImageview(string) - Get url to normal image scaled image from specified image file
  • GetFullview(string) - Get url to full view scaled image from specified image file
  • ScaleImage(string file, int width, int height, int mode) - Get url to a scaled image from specified image file, width, height and mode. See list of modes here.

Data

  • GetObject(int) - Returns an object by it's id
  • GetUser() - Returns current user
  • GetRequest(string) - Returns query string parameter by name
  • GetRequst() - Returns entire query string (without ?)
  • GetDisplayPage() - Return current page object

Array / string

  • GetFirst(array) - Gets first item in an array
  • GetLast(array) - Gets last item in an array
  • GetIndex(array, integer) - Gets item by index from an array
  • Join(string()) - Joins strings. No seperator can be specified.
  • Replace(string text, string find, string replacewith) - Replaces text within string. Params are: valuestring, findstring, replacewithstring.
  • Trim(string text, params string trimchars) - Trims all trim chars from edges of text. Specify chars or multiple strings.
  • Substring(string text, int start, optional int length) - Extracts specified part from a string.
  • Split(string text) - Splits lines in a string into string array. Removes empty lines.
  • Split(string text, string seperator) - Splits a string into string array
  • Chr(integer()) - Returns characters by ASCII numbers.
  • Sort(array,field) - Returns specified array sorted in ascending order by specified field.
  • SortDesc(array,field) - Returns specified array sorted in descending order by specified field.

Html encoding

  • StripHtml(string) - Removes all html from string and leaves document content
  • StripTags(string) - Removes all html or xml tags from string
  • HtmlEncode(string) - Encode any HTML characters so they are displayed in the page as symbols. (.NET function. Esite 4.1+ only)
  • UrlEncode(string) - Encodes a string for use as URL parameters (.NET function. Esite 4.1+ only)
  • HtmlAttributeEncode(string) - Encodes a value for use in an attribute (.NET function. Esite 4.1+ only)
  • HtmlDecode(string) - Decodes HTML encoded string (.NET function. Esite 4.1+ only)
  • UrlDecode(string) - Decodes Url encoded string (.NET function. Esite 4.1+ only)
  • UrlPathEncode(string) - Encode string for use in urlpath (.NET function. Esite 4.1+ only)

Maths

  • Mul(double()) - Multiplies specified numbers
  • Add(double()) - Adds specified numbers
  • Sub(double()) - Subtracts specified numbers in same order
  • Div(double()) - Divides specified numbers in same order
  • Cint(object) - Converts specified object to integer
  • GetDate() - Returns DateTime object with current time.
  • Mod(double a,double b) - Modulus (%) operator. result = a % b (c#) or a MOD b (vb).
  • SetVar(string variableName, object value) - Sets a variable. Read it later with GetVar
  • GetVar(string variableName) - Returns the value of a variable. See SetVar.

Load(filename) - User controls or objects

Examples below:

#load("item_header.ascx")# // Links in the general content item header
#load("item_footer.ascx")# // Links in the general content item footer
#load("my_user_control.ascx")# // Links any user control
#load(1052,Resource_Display)# // Displays object in specified mode 

Link(objectid or name) - Hash templates or objects

Examples below:

#link("my hash template")# // Links another hash template by name
#link(4545)# // Links in hash template or object (IDisplayable) by id

Redirect(url)

Examples below:

#redirect("http://www.google.com")#  // Redirects to an url
#redirect(object_field.displayurl)# // Reads value from field object_field and reads property displayurl

Hash templates may be extended with extra functions by Apps.