BostonEErs workshopSaturday 12/4/2010

Build an EE Site

1

Howdy!Ruthie ‘Danger’ BenDorunruthless.com

Marc ‘High Five’ Amosbostonwebstudio.com

~ with special thanks to ~

Andrew ‘Too Cool For A Photo’ Rodgersopenpixels.com

2

Thanks!

3

The Plan!• Get Acquainted With ExpressionEngine

• Install ExpressionEngine

• Break

• Model & Import Your Site Content

• Lunch

• Display Your Site Content

• Break

• System Tweaks & Tips

• Wrapup

4

Let’s begin.

5

Get acquainted with EE.

6

ExpressionWhat?• ExpressionEngine is an awesome content

management system for websites.

• SELF-HOSTED, not software-as-a-service.

• WEB-ADMINISTERED. All you need’s a browser.

• Written in PHP, runs on MySQL.

• Commercial product from EllisLab.

• Latest version is 2.1.1.

7

GoodForWhat?• ExpressionEngine runs all kinds of sites.

• It’s great for ...

• sites with complex content,

• sites run by non-technical content editors,

• membership sites,

• and more.

8

9

Install ExpressionEngine.

10

Step 1:Go get EE.

11

12

Step 2:Gather server info.

13

14

Step 3:Run server wizard.

15

• Before you install EE, make sure your web host can handle it:

1. Download the server wizard from http://expressionengine.com/files/ee_server_wizard.zip

2. Unzip and upload the ee_wizard folder to your web server.

3. Go to http://yourdomain.com/ee_wizard and fill out the form.

16

Step 4: Upload EE files to

web server.

17

Step 5:Make some

security tweaks.

18

• At a minimum, rename the ‘system’ folder something less easily guessable. (NOT ‘admin’, ‘controlpanel’, ‘login’, etc.) Then open index.php and update $system_path.

• Better option is to move the ‘system’ folder entirely outside the web root. Details here: http://expressionengine.com/user_guide/general/system_above_webroot.html

19

Step 6:Adjust file and

folder permissions.

20

• CHMOD the following files to 666:

• /system/expressionengine/config/config.php

• /system/expressionengine/config/database.php

• CHMOD the following folders to 777:

• /system/expressionengine/cache/

• /images/avatars/uploads/

• /images/captchas/

• /images/member_photos/

• /images/pm_attachments/

• /images/signature_attachments/

• /images/uploads/

21

Step 7:Run installation

wizard.

22

• Go to http://yoursite.com/system/ and the installation wizard will automatically start.

• Follow the instructions on the screen.

23

Bookmark these links!

24

Step 8:Remove installer

folder.

25

Step 9:Log into the

control panel.

26

Step 10:Dance Party.

27

Breaktime.Caffeine.

28

The Plan!• Get Acquainted With ExpressionEngine

• Install ExpressionEngine

• Break

• Model & Import Your Site Content

• Lunch

• Display Your Site Content

• Break

• System Tweaks & Tips

• Wrapup

29

Model YourSite Content.

30

31

Step 0:What are we

building here?

32

33

Step 1:Figure out what types of content

your site has.

34

35

36

These are your channels. Each

individual piece of content is an entry.

37

Each entry in a particular channel

has the same format - the same

custom fields.

38

Step 3:Plan, then build

your channels and custom fields.

39

Excel is your friend.40

Native fieldtypes41

Custom fieldtypes

42

Step 4:Give uploaded files

a place to go:File Upload Directories.

43

Step 5:Categorize your

content with, well:Categories.

44

Step 6:Control which

entries get published with Custom Statuses.

45

Lunch.Dibs on the caprese.

46

The Plan!• Get Acquainted With ExpressionEngine

• Install ExpressionEngine

• Break

• Model & Import Your Site Content

• Lunch

• Display Your Site Content

• Break

• System Tweaks & Tips

• Wrapup

47

Display YourSite Content.

48

Demo:static mockups

49

Demo:Template Manager

50

Demo:Template Groups

51

Demo:Create Templates

52

Demo:Populate templates

53

Demo:Handle CSS and JS

54

Demo:Add EE Tags

55

Demo:Plugins

56

Demo:Snippets

57

Demo:Global variables

58

Breaktime.Stretch.

59

The Plan!• Get Acquainted With ExpressionEngine

• Install ExpressionEngine

• Break

• Model & Import Your Site Content

• Lunch

• Display Your Site Content

• Break

• System Tweaks & Tips

• Wrapup

60

Performance Tweaks

61

the disable="" parameter

62

caching

63

.htaccess

64

minify CSS and JS

65

Throttling

66

Control Panel User Interface Tweaks

67

Customize the Publish page

68

Accessories

69

Done for today.But there’s a lot more to cover.

Sadly, we’ll have to save membership, e-commerce,search, and other nifty EE features for another time.

Hopefully this was enough to get you started.

70

Awesome sponsors.

71

It’s been real.Ruthie ‘Danger’ BenDorunruthless.com

Marc ‘High Five’ Amosbostonwebstudio.com

~ with special thanks to ~

Andrew ‘Too Cool For A Photo’ Rodgersopenpixels.com

72

bostonEErs.org

73