Setup Attendify Websites for your event app

To create an Attendify Websites for an Event/Application, you need to create Event/Application in Attendify Hub first. If you already have an Event/Application please proceed with following steps:

  • Open your Website dashboard
  • Click the New Website button
  • Select one of your Events from the select box
  • Choose a theme. For example, Template
  • Select a template, like Unfold
  • Click the Publish button

Please note: Attendify Websites are publicly available on the internet, even if your event has closed registration, access code protection, etc. If your app contains sensitive data, please consider not to publish it.

Attendify Websites settings and Custom Domains

Each Attendify Website has several settings that can be accessed from cards in your Websites dashboard.

Template Settings

Each Attendify Website Template theme has several settings. Depending on the theme, this setting can be used or not.

Design

On the Design panel, you can quickly switch the current Template or Widget theme and change the appearance of Event logo.

Custom Background allows you to add a different background to the Template header. To be displayed correctly, the image should be sized at least 1200x600 px.

Content

These settings allow you to modify/override content that will be used on the website. Description, Title and Subtitle are fetched from your event details unless you replace them in the relevant settings fields. The "Show Attachments in Details" setting will toggle the visibility of any attachment added to the speaker profile, session, etc.

Add social networks links to the pages or groups related to your website. Links can be added in a short: attendify or a long form: https://twitter.com/attendify

Depending on the Template used, these links will appear either in the header and/or the footer of the page. Social links are available only in the Template themes.

Tickets

Button - this setting will add a labeled ticketing button that will lead users to specified URL. Label example: "Get Tickets". Button is available only for the Template themes.

Ticketing widget - an HTML code widget, embedded without changes. Use it if you want to insert ticketing widgets such as Eventbrite, XING or others. This option is available only in the Template themes.

Settings

Analytics - an HTML code widget, embedded without changes. It will be placed at the bottom of the document. It is usually used for custom analytics widgets like Google Analytics, Kissmetrics or others. This option is available only in the Template themes.

Domain Settings

To setup a custom domain, you'd nedd to configure a CNAME or an A DNS record. You should be able to change DNS settings for your domain. Pleas note, that the propagation of changes can take up to 24 hours, depending on your DNS provider.

3rd level domains

For the 3rd level domains, like, event.example.com, you should use DNS CNAME record. In cooperation with your DNS provider, create a CNAME record that points to your event xxxxxx.attendify.io. Your CNAME record should look like this:

event.example.com     3500   IN   CNAME   xxxxxx.attendify.io

Where:

  • event.example.com - is your domain name
  • xxxxxx.attendify.io - is our default Attendify Websites domain.

Once DNS settings have been updated, you should add this domain to the domain settings in your Attendify Websites dashboard.

2nd level domains

If you'd like to use a 2nd level domain, you should use DNS A record. Add a DNS record like this to your DNS provider.

example.com      3500    IN     A         209.61.166.227

Where:

  • example.com - is your domain name
  • 209.61.166.227 - is the IP address of Attendify Websites front server.

Once DNS settings have been updated, you should add this domain to the website settings in your Attendify Websotes dashboard.

Please note: By dafault, secure SSL connections will not work with custom domain settings.

SSL with custom domains

In general, you will need a custom SSL offload service. One of these services is CloudFlare SSL https://www.cloudflare.com/ssl/. There are several steps you need to undertake to enable SSL:

  • Set Cloudflare as your DNS provider
  • Depending on the level of your domain, set an A or a CNAME record to the existing Attendify Websites event domain.
  • Enable CloudFlare SSL and traffic forwarding.

Custom Design templates

Custom Design option allows you to build your event website based on the template with a custom look and feel. The easiest way to customize a template is to download and modify our existing template theme. You can find the download link in the settings page of your event inside the Attendify Websites dashboard.

Each Attendify Websites theme is optimized for one of the use cases: a standalone website or an embedded widget. Your template can combine both these use cases.

Your templates are not shared and are available only for your event.

A theme template is a single zip file with several files in it. Attendify Websites service will download your zip file, unpack it and render all HTML files. Then, all of them will be published to the root folder on our server.

Files layout

Each theme template consists of several files which should meet following requirements:

  • The top level folder should contain the /index.html file.
  • The total size of your files should be smaller than 50mb.
  • Your theme should contain no more than 64 files.
  • Each file should be smaller than 5mb.

Tip: You can use the /index.html file as a standalone site and the /widget-schedule.html file as an embedded widget.

Custom Design template syntax

Our template engine uses Django like syntax. Templates consist of plain text that contains embedded expressions and filter tags. Variables are used to inject dynamic content into the template. The values of the variables are looked up in the context map. When a value is missing, an empty string is rendered in its place.

Variables are defined using the double curly braces: {{myvar}}. Variables can also be nested data structures, eg: {{person.name}} - will lookup for name key inside an object located under person key in context {"person" : {"name": "John Doe"}}.

Tags are used to add various functionality to the templates such as loops and conditions. For example, if you'd like to create a list from a collection of items, you could use the for tag as follows:

<ul>
{% for item in items %}
    <li>{{item}}</li>
{% endfor %}
</ul>

Filters

Filters are used to post-process the value of a variable. For example, it's possible convert a value to the upper case, pluralize it, or parse it as a date. This can be done by specifying a filter after the name of the variable. The filters are separated using the | character.

To convert the user-name variable to upper case: {{user-name|upper}}

add

Adds a number to number or concatenates strings

{{two|add:2}} context:{"two": 2}
=> 4

{{h|add:e:l:l:o}} context:{"h": "h"}
=> "hello"

capitalize

{{name|capitalize}} context: {"name": "russian tea is best tea"}
=> "Russian tea is best tea"

count

{{name|count}} context: {"name": "Jane"}
 => "4"

{{items|count}} context: {"items": [1 2 3 4]}
=> "4"

count-is

{{x|count-is:3}} context: {"x"" [1 2 3]}
 => "true"

currency-format

{{amount|currency-format}} context: {"amount": 123}
=> "$123.00"

Uses java.text.NumberFormat/getCurrencyInstance for formatting the currency value. The formatter defaults to the "en_US".

An ISO 639 2-letter language code can be added as a locale.

{{amount|currency-format:de}} context: {"amount": 123})
=> "€ 123,00"

Additionally, the locale can be followed by the country code.

{{amount|currency-format:de:DE}} context:{"amount" 123}
=> "€ 123,00"

date

Valid predefined date, time formats: shortDate shortTime shortDateTime mediumDate mediumTime mediumDateTime longDate longTime longDateTime fullDate fullTime fullDateTime

{{d|date:"yyyy-MM-dd"}} {d: null}
=> ""

for current time, use the now tag

{{creation-time|date:"yyyy-MM-dd_HH:mm:ss"}} context: {"creation-time": <java.util.Date>}
=> "2013-07-28_20:51:48"

{{today|date:shortDate}}" context: {"today": <java.util.Date>}

=> "8/3/13"

{{now|date:shortDateTime}} context: {"now": <java.util.Date>}

=> "8/3/13 2:08 PM"

default

If the key is not present in the context or has a null-value, a default string will be used.

{{name|default:"Unknown"}} context:{"name": "Attendify"}
=> "Attendify"

{{name|default:"Unknown"}} context:{"name": null}
=> "Unknown"

{{name|default:"Unknown"}} context:{"name": []}
=> "[]"

{{name|default:"Unknown"}} context:{}
=> "Unknown"

default-if-empty

Works just like default filter, except for this case:

{{name|default:"Unknown"}} context:{"name": []}
=> "Unknown"

double-format

Adds required number of decimals

{{tis-a-number|double-format:2}} context: {"tis-a-number": 10.00001}
=> 10.00

empty?

Returns true if the value is empty

{% if xs|empty? %}foo{% endif %} context: {"xs" []}
=> "foo"

not-empty

Returns true if the value is not empty

{% if xs|not-empty %}foo{% endif %} context: {:xs [1, 2]}
=> "foo"

first

Gets the first item in collection

{{seq-of-some-sort|first}} context:{"seq-of-some-sort": ["dog", "cat"]}
=> :dog

get-digit

Gets the i-th digit of a number, 1 is the rightmost digit. Returns the number if the index is out of bounds

{{a-number|get-digit:1}} context:{"a-number": 12.34567}
=> 7

hash

Generates hash from the input value. Available hashes: md5, sha, sha256, sha384, sha512

{{domain|hash:"md5"}} context: {"domain": "example.org"}
=> "1bdf72e04d6b50c82a48c7e4dd38cc69"

join

Joins values from the sequence with provided separator. By default separator is ""

{{sequence|join:", "}} context:{"sequence": [1, 2, 3, 4]}
=> "1, 2, 3, 4"

json

Generates JSON from the input value. By default content will be escaped.

{{data|json}} context:{"data":[1, 2, {"foo": 27, "dan": "awesome"}]}
=> "[1,2,{&quot;foo&quot;:27,&quot;dan&quot;:&quot;awesome&quot;}]"

The safe filter should be used for unescaped output.

last

Gets the last element from a sequence.

{{sequence|last}} context: {"sequence": 12.34567}
=> 7

length

{{sequence|length}} context: {"sequence": [1, 2, 3, 4]}
=> 4

linebreaks

Single newlines become <br />, double newlines mean a new paragraph. Content will be escaped by default.

{{foo|linebreaks|safe}} context: {"foo": "\nbar\nbaz"}
=> "<p><br />bar<br />baz</p>"

linebreaks-br

Like linebreaks but doesn't insert <p> tags.

{{foo|linebreaks-br|safe}} context: {"foo": "\nbar\nbaz"}
=> "<br />bar<br />baz"

linenumbers

Displays text with line numbers.

{{foo|linenumbers}} context:{"foo": "foo\n\bar\nbaz"}
=> "1. foo\n2. bar\n3. baz"

lower

Converts value to a lower-case string.

{{foo|lower}} context: {"foo": "FOOBaR"}
=> "foobar"

number-format

{{amount|number-format:%.3f}} context: {"amount": 123.04455}
=> "123.045"

An ISO 639 2-letter language code can be added as a locale.

{{amount|number-format:%.3f:de}} {"amount": 123.04455}
=> "123,045"

pluralize

Returns the correct (English) pluralization based on the variable. Works for most words, but not for all (eg. foot/feet, mouse/mice, etc.)

{{items|count}} item{{items|pluralize}} context:{"items": []}
=> "0 items"

{{items|count}} item{{items|pluralize}} context:{"items": [1]}
=> "1 item"

{{items|count}} item{{items|pluralize}} context:{"items": [1, 2]}
=> "2 items"

{{fruit|count}} tomato{{fruit|pluralize:"es"}} context:{"fruit": []}
=> "0 tomatoes"

{{people|count}} lad{{people|pluralize:"y":"ies"}} context:{"people": [1]}
=> "1 lady"

{{people|count}} lad{{people|pluralize:"y":"ies"}} context:{"people": [1, 2]}
=> "2 ladies"

{{people}} lad{{people|pluralize:"y":"ies"}} context:{"people": 2}
=> "2 ladies"

rand-nth

Returns rand-nths value from a collection:

{{foo|rand-nth}} context:{"foo": [1, 2, 3]}
=> "2"

remove

Removes specified characters from the string:

{{foo|remove:"aeiou"}} context:{"foo": "abcdefghijklmnop"}
=> "bcdfghjklmnp"

remove-tags

Removes the specified HTML tags from the string:

{{value|remove-tags:b:span}} context:{"value" "<b><span>foobar</span></b>"}
 => "foobar"

safe

By default template engine will HTML escape all variables. The safe filter exempts the variable from being html-escaped:

{{data}} context:{"data": "<foo>"}
=> "&lt;foo&gt;"

{{data|safe}} context:{"data": "<foo>"}
=> "<foo>"

sort

Sorts values in ascending order.

{{ value|sort }} context:{"value": [1, 4, 2, 3, 5]}
=> "(1 2 3 4 5)"

sort-by

Sorts values by ascending order of value under provided key:

{{ value|sort-by:name}} context:{"value": [{"name": "John"} {"name": "Jane"}]}
=> {"name": "Jane"}, {"name": "John"}

sort-reversed

Same as sort, but in reverse order

sort-by-reversed

Same as sort-by, but in reverse order

str

Converts value to a string.

title

Capitalizes the words in a string:

{{s|title}} context: {"s": "my fancy title"}
=> "My Fancy Title"

upper

Converts string to upper-case:

{{shout|upper}} context:{"shout": "hello"}
=> "HELLO"

urlescape

{{data|urlescape}} context:{"data": "data url"}
=> "data+url"

by-id

Finds entity with specified id in related listing:

{{sessions|by-id:"dkbFasfyf"}}

group-by

Groups entities by field value

{{sponsors|group-by:"level"}}

get-in

Gets a value from the object by path. Path items joined via .

{{v|get-in:"level.name"}} context:{"v": {"title": "Attendify", "level": {"name": "Gold"}}}
=> "Gold"

is-nil

If value equals nil returns true.

{{v|is-nil:"title"}} context:{{"title": "Attendify"}}
=> false

{{v|is-nil:"job"}} context:{{"job": ""}}
=> false

{{v|is-nil:"link"}} context:{{"link": nil}}
=> true

Data structure

Each text template will be rendered with the same context. Context has the following keys representing event information:

  • headline - Headline of the application or event title
  • subtitle - Subtitle of the application or event header
  • dates - Start and end dates of the application or event
  • storeDescription - App description that is used in AppStore or GooglePlay
  • storeIcon - URL of the resized event logo
  • storeName - Application name
  • location - Location of the application or event venue
  • address - Event address
  • icon - Application or event icon
  • banner - Application banner image
  • header - Application header
  • color - Application appearance color or event color in hex code
  • description - Event description
  • linkAppStore - AppStore link to the application
  • linkGooglePlay - Google Play link to the application
  • linkWebmobile - Link to the web-mobile page
  • features - List of features that are added to the application or event
  • domain - Current Attendify Websites domain

Listings of all entities across all features. Each entity in these listings has an id field which can be used for identification. Features and all entities are sorted and appear in the same order as in the Event Application.

  • speakers - ordered list of speakers
  • sponsors - ordered list of sponsors
  • companies - ordered list of companies
  • exhibitors - ordered list of exhibitors
  • members - ordered list of members
  • sessions - all sessions from all days from all schedules
  • days - ordered collection of days
  • tracks - all tracks
  • groups - all groups used by speakers, staff, places or members
  • levels - all sponsor levels
  • categories - all exhibitor categories
  • booths - list of all booths
  • files - list of all files attached to the entities
  • places - list of all places

Speakers

Data structure that describes each speaker at your event

{
    "description": "",
    "scheduleSessions": [
        "3BPTtuPxqM2OuoLYH" // List of related sessions
    ],
    "email": "info@example.com",
    "group": "Manager", // Speaker group title
    "phone": "+123-456789",
    "photoOriginUrl": "https://s3.amazonaws.com/dntstatic/33cc61db-e231-48c9-746c-b5405cf58301", // Large photo url
    "firstName": "Lisa",
    "type": "speaker",
    "priority": {
        "group": 0.5,
        "lastName": 0.75,
        "firstName": 0.5,
        "external": 0.5,
        "manual": 0.5
    },
    "photo": "https://s3.amazonaws.com/dntstatic/33cc61db-e231-48c9-746c-b5405cf58301_120_120.png", // Thumb photo
    "id": "3BPTtuPxqM2OuoLYE", // Speaker ID
    "lastName": "Thompson",
    "files": [ // List of related files
    ],
    "position": "General Manager",
    "company": " American Industry Association"
}

Sponsors

{
    "address": "",
    "email": "info@example.com",
    "logoOriginUrl": "", // Large sponsor logo
    "logo": "", Small sponsor logo
    "phone": "(123) 456789",
    "type": "sponsor",
    "level": "Silver", // Sponsor type
    "priority": {
        "level": 0.5,
        "company": 0.5,
        "external": 0.5,
        "manual": 0.5
    },
    "id": "3BPTtulwWdcQ0yd6e",
    "files": [], // List of related files
    "website": "http://www.example.com/",
    "company": "Example",
    "profile": "" // Sponsor description
}

Companies

{
    "description": "This is sample description",
    "category": "Shipment", // Company category
    "address": "",
    "email": "",
    "logo": null, // Company logo
    "phone": "",
    "name": "Example LTD",
    "type": "company",
    "priority": {
        "company": 0.5,
        "manual": 0.5,
        "level": 0.5,
        "name": 0.5
    },
    "id": "943SVQhqL36p2OsUc6", // ID of Company
    "files": [],
    "website": "example.com",
    "linkedin": "",
    "facebook": "",
    "twitter": "",
    "google": "",

}

Exhibitors

{
    "category": "Booth #: 123",
    "address": "",
    "email": "info@example.com",
    "logoOriginUrl": "https://s3.amazonaws.com/dntstatic/9a052632-72ed-41df-527c-cc27980e7378", // Lagre Exhibitor Icon
    "logo": "https://s3.amazonaws.com/dntstatic/9a052632-72ed-41df-527c-cc27980e7378_180_120.png", // Thumb of Exchibitor Icon
    "phone": "+123-456789",
    "booth": "123",
    "type": "exhibitor",
    "priority": {
        "category": 0.5,
        "company": 0.5,
        "external": 0.5,
        "manual": 0.5
    },
    "id": "3BPTtulwWdcQ0yd6k", // Exchibitor ID
    "files": [],
    "website": "http://www.example.com/",
    "x-external-id": "Exhibitor:4j61KoPPOLyE6zhSQ",
    "company": "Example.com, Inc.",
    "profile": "" // Exhibitor description
}

Members

Member entity.

{
    "description": "",
    "email": "",
    "group": "Cookers", // Name of member group
    "phone": "",
    "photoOriginUrl": "", // Large member photo
    "firstName": "Uncle",
    "type": "member",
    "priority": {
        "firstName": 0.5,
        "lastName": 0.5,
        "manual": 0.5,
        "group": 0.5
    },
    "photo": "", // Resized member photo
    "id": "943SVQhqL36p2OsUc7",
    "lastName": "Bob",
    "files": [], // List of attached files
    "position": "Chef",
    "google": "",
    "linkedin": "",
    "twitter": "",
    "facebook": "",
    "x-external-id": null,
    "company": "Stuff Com."
}

Sessions

A single session from the schedule.

{
    "description": "",
    "day": "2015-02-13",
    "speakers": [], // List of ID's of related Speakers
    "startTime": "2015-02-13T08:00:00", // Session start time
    "endTime": "2015-02-13T09:00:00", // Session end time
    "type": "schedule-session",
    "title": "Panel Discussion: User perspectives, delivering innovation for digital culture",
    "priority": {
        "external": 0.75,
        "manual": 0.75
    },
    "id": "3BPTtuPxqM2OuoLYJ",
    "files": [], // List of related files
    "x-external-id": "ScheduleSession:3Z9CARHrcE4T8JMEl",
    "location": "Hall C",
    "track": [] // List of related track
}

Days

List of days containing relevant sessions

{
    "id": "3BPTtvpsZUMTJTTlt",
    "type": "schedule-day",
    "date": "2015-02-13", // Date
    "sessions": [ ] // List of sessions, see Sessoins structure description
}

Tracks

List of all session tracks.

{
    "id": "3BPTtvpsZUMTJTTlr",
    "type": "schedule-track",
    "color": "#6BC7BE", // Session Track color
    "title": "Panel Discussion", // Session title
    "priority": {
            "external": 0.75,
            "manual": 0.75
    }
}

Groups, Levels and Categories

Each of these entities contains a name and id.

Booths

A list of boots. Each booths has:

{
    "name": "", // Name of the Booth
    "number": "", // Booth number
    "color": "", // Booth color
    "id": "",
}

Files

A list of all files related to any entity

{
    "id": "3BPhr61DebNjNtKFm", // List of
    "type": "file",
    "s3id": "1c080871-5b22-40c1-5dc0-381d5c956776",
    "name": "example.pdf", // File name
    "size": 681563, // file size in bytes
    "url": "" // Public available URL for file download
}

Places

A list of all places (POI) at the map.

{
    "description": "",
    "address": "199 Valencia Street, San Francisco, CA 94103, United States",
    "group": "Restaurant", // Group title
    "name": " Zeitgeist ", // Place title
    "city": "",
    "type": "place", // type of the pace
    "state": "",
    "priority": {
        "group": 0.5,
        "external": 0.5,
        "manual": 0.5
    },
    "zip": "",
    "id": "3BPTtuPxqM2OuoLYL",
    "lat": 37.770028, // Coordinates of place
    "lng": -122.422098
    }

Custom Attendify Websites Sources

Custom theme templates allow to customize and modify a theme according to your event style. Each template should have an index.html in the top level folder. All folders and other files will be served from root as is. Attendify Websites does not allow to list folder files.

You can upload a theme template as the zip file. When your file is uploaded, we will automatically check it for errors. If there were no errors, you can proceed and publish your website. Otherwise, please correct the errors and upload a new zip file.

Errors

The list of errors:

Filesize quota exceeded - one of the files in your custom design is greater than the max allowed size. Does not matter whether it is a source file or an already rendered file. Please reduce original file size. If it is an already rendered file - try to render less content from your app.

Total project size quota exceeded - Total size of your files or rendered templates exceeded the allowed size.

Number of files in project quota exceeded - Total amount of files should be less than 200.

Theme template should have index.html - Your theme template should have an index.html file in the top level folder.

FAQ

Can I create 2 websites for one event?

For each event, you can set up and publish only one Attendify website

Can I create a website from the template and a widget at the same time?

Yes, but you need to combine the template and widget themes in a single theme and use it as your Custom Design.

How do I switch between widget and template themes?

You need to delete your current website and set it up with a different template. You can remove your website using a link in the Setting page.

I have made changes in the Attendify Hub, when will my website be updated?

We are continuously fetching changes from your event content and will rebuild your website as soon as we get at least one change. Usually, it takes up to several minutes.

Can I rearrange features or hide a particular one?

Yes, you can. The easiest way to do this is to use a custom design option for your event website. For example, you can use one of our template themes by downloading it from the Custom design screen. Just apply the required changes and upload it as Custom design.