Hello Drupal

  • 16,909 views
Uploaded on

If you're brand new to Drupal, let Hello Drupal be your welcome wagon. …

If you're brand new to Drupal, let Hello Drupal be your welcome wagon.

Find out more on http://training.acquia.com/hellodrupal

Updated 2 April 2012

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
  • LA PERSONA QUE ME LO ENVIO ESTA TODAVIA ASOMBRADA DE LO OCURRIDO, YA QUE ELLA DICE QUE LO HIZO POR HACERLO Y QUE PIDIO ALGO QUE CREIA CASI IMPOSIBLE DE LOGRAR PROBEMOS. * Para ti mismo di el nombre de la unica persona del sexo opuesto con quien quieras estar (tres veces...)... * Piensa en algo que quieras lograr dentro de la proxima semana y repitelo para ti mismo(a) (seis veces)... * Piensa en algo que quieras que pase entre tu y la persona especial (que dijiste en el no. 1) y dilo a ti mismo/a (doce veces)... * Ahora haz un ultimo y final deseo acerca del deseo que escogiste. * Despues de leer esto tienes 1 hora para mandarlo a 15 temas y lo que pediste se te hara realidad en 1 semana. A la mayor cantidad de gente a quien lo mandes mas fuerte se hara tu deseo. Si tu escoges ignorar esta carta lo contrario del deseo te sucedera, o esto no sucedera jamas.............. Que tus días estén llenos de logros y tus noches de sueños copia y pega esto en 15 o + tema
    Are you sure you want to
    Your message goes here
  • it's a nice introduction
    Are you sure you want to
    Your message goes here
No Downloads

Views

Total Views
16,909
On Slideshare
0
From Embeds
0
Number of Embeds
9

Actions

Shares
Downloads
287
Comments
2
Likes
8

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide
  • Ideally you will have sent them the “before you arrive” activity- to make an account and site on DG. \nAs people come in, make sure they have done the “before you arrive” activity. If not, hand them their manual, and show them to fire up their browser and create and site on Drupal Gardens. This lowers the risk of sites needing to queue. \n
  • \n
  • This is a short introduction. Main purpose is to get familiar with the audience, and make sure they know what you’re going to do today. \n- Make sure people have their gardens site set up. If not, get them started in the manual.\n
  • This is a quick overview of what they will do today. Don’t dwell on each slide. Just go through quickly!\n
  • Point out that the schedule is in the manual, or if you have revised any of the times. \nGo over any pedestrian details regarding lunch locations, where to loo is, etc. \n
  • We’ll look at cases which demonstrate real-world examples of the same procedures you’re learning. \n
  • There are a variety of new features and functionality. \n
  • 1. Configure your site name and slogan. \n2. Create a static block of text.\n3. Add new content.\n4. Add a webform to collect information from visitors. \n5. If you have time, add a banner. \n
  • After this introduction section, the blue slides generally match to the “UNITS” in the manual. You can start a unit with a quick presentation and a demo if suitable.\n
  • Fill in information about your company!! Or ALT+TAB to your own site, or add in your own slides.\n
  • This slide left blank! Open up tabs in your browser of your own recent client projects and show of what YOU have been doing!\n
  • Please mention the training available. Mention how important feedback will be to us.\n
  • Ask about their previous experience.\nIf you have a small group, < 10 people, Have each person introduce themselves, and tell about a project they are currently working on where they think Drupal Gardens (or Drupal) may help.\n
  • \n
  • Do a check to make sure everyone has the right equipment. You may or may not be providing the environment for them. Make sure all the students have a local Drupal instance available and working.\n
  • If they haven’t done these things, point this out in the manual under “before we start” and get them on it. \n
  • Lots and lots of people have questions about what Drupal Gardens is, and they need a comparison. \nWe had to include these slides about the service as it left new users with many many questions!\n
  • We’ll be using a hosted version of Drupal. Drupal Gardens is simply, Drupal, but hosted so you you don’t worry about upgrades to software. \n
  • New users are often confused by this! \nDrupal Gardens has a selection of popular modules. But you can’t add your own. There are also small user interface differences, such as a “Save Draft” button. But if you like that, you can add that to your own site - because the modules are ALL open source. \n
  • Overall - the user interface looks almost exactly the same. \nWith Drupal Gardens, you get hosting, and you also get a “Help” link to a search tool, and a list of your sites. \nWhen you click on appearance you see the main differences. \n
  • This is only available in Drupal Gardens. You develop visual design using a themebuilder tool. This is not open source, and it’s one of the features that makes the service sticky.\nHowever you CAN export your site and themes.\n
  • You can export, but currently you cannot import a site into Drupal Gardens.\nOn your “my sites” list you can export and host anywhere, bringing your data with you. You can also duplicate a site to make a new iteration, or use a base site to replicate. \n
  • \n
  • Direct participants to open their manual to the Welcome section, and locate “Exercise: Change your site title”. \n
  • Direct participants to open their manual, and locate “Exercise: Change your site title”. The title of your site will appear in the title bar of your browser and in search engine results. The slogan will appear on the front page title bar, and under the heading of the site. What will you call your site?\n
  • \n
  • The Drupal community often uses “Lego bricks” as the preferred metaphor for what Drupal is. \nhttps://twitter.com/#!/tom_eric/status/26847650412 \n
  • The metaphor is useful because we can think of some systems working well out of the box. Yet if you want to customize them, it’s more difficult. With Drupal you can get more customization, but the individual pieces are more generic.\n
  • We can think of elements such as fields, content types and modules as individual components. The various distributions can be thought of as kits, with custom made components, with some assembly required.\n
  • Talk about what Drupal IS. \n
  • Drupal is many different things to many different kinds of organizations and companies.\n
  • Companies, museums and organizations such as the King Center use Drupal to maintain an online presence. \n
  • Drupal is a publishing platform. \n
  • Florida hospital uses faceted search to help patients find expert care. \n
  • Dev.twitter.com - used for discussions, documentation and knowledge sharing.\n
  • \n
  • \n
  • Drupal is widely used in academia as well. Both for online presence and as virtual learning environments.\n
  • \n
  • These sites for Warner music artists are built on Drupal gardens- they have a centralized way to manage many sites.\n
  • \n
  • Companies are building and hosting “site builder” services. \n
  • Digital agencies such as Commerce Guys can specialize in e-commerce, and released their code as open source. \n
  • \n
  • Compared to other CMS, especially proprietary and custom CMSs.\nWhile Drupal’s core modules are flexible, there are a range of contributed modules to extend to most feature sets you need.\n
  • Compared to other CMSs....\nYou can build on top of a flexible, well documented API to save yourself hours of coding from the ground up.\n
  • You can improve your client’s user experience with back end customization and themes.\nHere we see “workbench” which makes a more user friendly content administration UI. \nHere is also the Admin module which adds a sidebar and the Rubic admin theme.\n
  • Drupal does a few things out of the box...Menu system; Content type creation; User management; Taxonomy; Comments; search, content translation, etc etc... and more - in addition you can create unique functionality through coding... \n
  • Just check out the distribution packages which are specific products for a specific case. You can download them and have the beginning of your conference website, your online community or publishing platform.\n
  • Drupal’s community has evolved with mature, experienced agencies with specialization in both technical areas and verticals such as education, commerce, small businesses, and drupal-specific services. \nAs a service provider yourself, you can find potential collaborators to compete for larger projects. \nThis is also attracting many new clients with specific needs.\n
  • Drupal has a highly active community of contributors. Just in Feb 2012, Drupal surpassed 16k actively contributing Developers! That doesn’t count the many active users and advocates who help others. \n
  • Thousands converge for the conferences. Twice yearly in N. America and Europe, and soon annually in S. America. These show the combined numbers for the events. Went from 50 people in Antwerp in 2005, to averaging 4500 each year. At this time, we don’t know yet how big Munich will be!\n
  • There are DrupalCamps happening all over the world, all throughout the year with numbers from 60-400 people. Each week, the Drupal Dojo hosts a virtual session. And You can find weekly or monthly meet-ups on local Groups in your area. \n
  • There are bi-annual conferences, one in the US, one in the EU- and soon in South America. This is a place to hire or be hired, to learn, to socialise. GREAT PLACE FOR NEW DRUPALISTS!!\n
  • This is an administration tour. There are specific activities in the manual for this. You can also rush through this as a presentation if you don’t want to do the activities. Where this is an activity it says “Try this...”\n
  • Drupal plays well with others. PHP is pretty much the only requirement. \nDrupal can support other SQL databases, but needs additional support for noSQL databases.\n\n
  • The administration area is customizable. You can even change the way it looks or add your own administration pages.\n
  • There are basic content types, such as basic pages and articles. You will see how to make new content types. \n
  • The core block system has some basic layout and positioning tools. These can be extended with a number of other modules.\n
  • \n
  • \n
  • Drupal’s theme system is one of overriding output. A minimum theme can be done with just a CSS overrides. \nSeparation of business logic and display from data using the theme system.\n
  • This section is for a LESS technical audience. You can skip this if you don’t have that audience!\n
  • SKIP IF GROUP IS FAMILIAR WITH CMSs! Anyone remember “The Webmaster”\nFirst let’s look back for a moment to see the problem Drupal was originally designed to solve. Sites were mainly text and images, with a hierarchical site structure. Sites were assumed to be accessed mainly from their front pages, before powerful search engines. Site maintenance consisted of updating text pages. \n
  • SKIP IF GROUP IS FAMILIAR WITH CMSs!\nCan anyone think of why this might be a problem?\nDesign updates?\nUser generated content?\nWe may think of the original way websites were designed. All the data and design was kept in one file. Sites became increasingly complex to update and redesign with data and presentation trapped in one file. \n\n
  • SKIP IF GROUP IS FAMILIAR WITH CMSs!\nNow database driven sites could be built off of templates. Business logic separated from templating logic. Now you had users, logging in and interacting. \n
  • SKIP IF GROUP IS FAMILIAR WITH CMSs!\nSites are more interactive, social and media rich than they were even 10 years ago. \nExpectations are that the site is driven by users, not by site owners.\nIn addition, Open source became very important, in large part because now files could be transferred more easily w/o disks!\n
  • \n
  • \n
  • The Economist had to do a major migration from a previous content management system. They have massive amounts of content. \nAt 1) We see a simple list of the latest blog posts, their authors, and how long ago they were done. \nAt 2) We see a static block of links. This might be maintained through just editing the HTML of a block for example.\n
  • Previous: Cold Fusion on Oracle Data base\nComplex data structure; Complex joins for simple relational cases\n
  • The fulcrum of this project was the migrate module. Migrate allowed incremental synchronization between systems.\n
  • Direct.gov hosts all public services in one place. This is NOT a Drupal site.\n
  • They made a microsite to allow participants to share prototypes of mashups in a collaborative digital environment with the open source development community. The addition of non-personal government data sources gave the community a chance to innovate alongside the government. \n
  • These are the basic requirements - to allow developers to submit apps and for others to share ideas. \n
  • The entire submission form is the same kind of form they use for adding other content, like blog posts. This one is extended with custom fields. \n
  • Direct participants to open their manual, and turn to the exercises in Session 1\n
  • First, we’ll add a block. 2nd, we’ll position the block in the sidebar. 3rd, we’ll check to see the block.\n
  • When you get to the Block configuration page, also look at the other blocks were are available by default. These options appear depending on modules you have enabled, and how you configured modules. \n
  • We’ll add news items with an image, which show up in the news list. If you have time, you can challenge yourself by adding a basic page. This static page, is a different content type, and is not configured to display on the front page. Direct participants to open their manuals and try these!!\n
  • \n
  • Do reviews optionally, if you are doing the 3 hour version, or if you want to reinforce some concepts.\n
  • Introduce the client. And also click on the inspiration link to review a site for some ideas. Step by step tutorials to excite people about reusing cast off materials in creative ways. Contributors can apply to be “tutors” and write articles. Contributors can submit videos to demonstrate techniques.\n1. Elicit: How they’d make the slogan go to to the right? (Use CSS). \n2. Elicit: What content type is showing here? (A tutorial, but we only see the title and summary). \n3. How would they place this video and this photo of a user on the page? (They may not know this now, but pique their curiosity, and they will see more about this next. \n
  • \n
  • \n
  • In your mind, you may be thinking of a mental site map.... this model is so ingrained in us. Folders, documents... \nMake the document, add the content.\n
  • We tend to think this way- starting with the structure of the pages... \nDesign planning tends to focus on the front end - what is visible and visual. You may imagine this WHOLE page as one unit.\n
  • Then we think about how the content will fit in. We want to place the content directly. \nMaybe the top article is a featured article?\nMaybe the bottom ones are from specific authors or sections of the site?\n
  • You may have content appearing in different ways in different places on your site. \n
  • Instead, think Content first. Imagine your data storehouse of information. \n
  • Imagine if you had generic posts with a page title and body text. Your editors might put in any manner of content, such as text, images, location information, etc. \nIf you structure the content you have more control of what data gets saved when editors add content.\n
  • \n
  • \n
  • \n
  • Visit this site. It may look a little different from this image. Locate the poll block. \n
  • Enable the poll Module > Add a poll > Place block in the sidebar.\n\nThe twitter module probably works like this to. When you configure the twitter module, a block will be generated automatically. \n
  • Visit this site. Identify MENUS and BLOCKS\nLook at the components on the site. Some components come from modules: Poll module. Some might be custom blocks with HTML. \n
  • These are the same regions you see in your block display. Admittedly, this isn’t intuitive. There are additional systems which provide drag and drop control. Mention Panels.\n
  • All themes in Drupal Gardens have the same regions available to them. These are arbitrary. \n
  • Often people wonder how Drupal integrates with other systems\n
  • \n
  • The level of integration will make the difference as to what solutions you use. \n1. Follow module\n2. Core aggregator, feeds, and others. \n3. Twitter provides a “tweet” button, but there are other services such as Add this, AddtoAny, etc. \n4. The Twitter module allows a login.\n
  • Again it depends on what level of integration you want. Do you just need a Like button? Do you want users to see who else is logged in? Do you want to develop an application?\n
  • There are so many different kinds of integration modules, it depends on your own needs. \n
  • Open up the http://opensource.com website. Show it to people - have them visit it to think of questions. \n
  • OpenSource.com is a high volume news site, with participation from multiple authors, and users who can add comments, and have profiles. In this example we can see the same content rendered in different ways in different places. \n1) On the front page, the image is smaller. 2) We see a medium size image on the topic page. 3) We see the full page view of the article.\n
  • Each content type comes with two displays by default. However you can get more specific kinds of display by selecting fields. \n
  • You can configure a thumbnail to be, for example, 100 x 100 pixels, and it will automatically update the thumbnail throughout the whole site. Let’s look at this in more detail.\n(You don’t need to read the slide to them!)\n
  • First, you’ll extend your content type by adding an image field. This handles uploading the image and storing it. You will configure how many files per field, and where the image gets stored, and even a default image. \n
  • You’d also need to configure how the image is going to be processed. You can rotate, crop, scale, desaturate. Here is the UI for configuring media styles. \n
  • When you configure display you can add a view modes to configure. In this case, Full content and Teaser modes. \nThen you can select the “Image style” from the list of configurable options.\nWant MORE display modes? Use Display Suite. \n
  • \n
  • So now, when you look at a great site like London.gov.uk you can understand how they manage to show content in different places in different ways. \n
  • Direct participants to open their manual, and turn to the exercises in Session 2\n
  • The options available depend on what modules you have enabled and installed. \n
  • Do reviews optionally, if you are doing the 3 hour version, or if you want to reinforce some concepts.\n
  • Introduce the client. And also client on the inspiration link to review a site for some ideas. Explain, this is a website for a special bijoux museum. The site helps keeps repeat visitors coming back again, while enticing potential visitors to see what is on offer. \n- Elicit: How many content types can they see suggested here? Point out the tabs. (Exhibitions, interviews, pages.) Tease out that a listing page: “What’s on” might be different from a basic page “About us”. \n1. Elicit that the 3 “current” exhibitions display an image and a link, but no text. Draw out how this “teaser” mode may be configured, and how it knows which are “current”. \n2. Elicit that the buttons are probably just graphics and links in a static block.\n3. Elicit that this is a list of exhibitions which are not currently on. Elicit that this is a HTML list, and only a linked title.\n
  • \n
  • \n
  • \n
  • Contributed modules answer the question: Can Drupal do X? Most likely “There is a module for that.” \nModules extend the functionality of Drupal. These are some examples. \nFivestar for ratings, Date and Calendar for adding dates and displaying content in calendars.\nViews slideshow, or the “ShareThis” module which add quick links to social sites. \nYou could think of them as add-ons, or as plugins or extensions; or as applications which run on Drupal. \n
  • Modules extend the functionality of Drupal. You could think of them as add-ons, or as plugins or extensions; or as applications which run on Drupal. \n
  • Modules are mainly text and PHP files. And any supporting libraries, scripts, image or CSS files.\n\n(If anyone asks, this is Comment Allow Anonymous)\n
  • Drupal’s theme system. Control visual look and final place to alter rendering markup, separate from the data. Components include CSS files & PHP files with HTML. \n
  • Themes are text files and any supporting libraries, scripts, image or CSS files.\n\nTemplate files are a mix of HTML and PHP. \n\n(If anyone asks, this is Danland). \n
  • Drupal “core” is a set of scripts which handles users, content, the menu system, taxonomy, translation, search. \n
  • In your “sites” folder you add your alterations. This can be done with contributed libraries, modules and themes, or custom modules and themes. Let Drupal do the easy stuff, and spend your time doing the really tricky custom stuff. \nNow we’ll do some exercises to see how this works. \n
  • If there is one cardinal rule in Drupal, it is: Don’t hack core!\n\nSee the red X there? - Don’t be “that guy”\n\n
  • \n
  • Browsing through the module categories gives you a sense of the range available. Some are utility modules, some work at a system level, some at a user interface level.\n
  • You don’t want a specialized module for events, posts, member profiles - when you can leverage the existing fields system and views which you are already using on your site. \nA good example is the Event module which used to do one thing: add and display events. now it’s replaced by using several modules together. \nThis makes the solution more flexible.\n
  • Drupal used to have more “all in one” modules. Similar to a Joomla-approach.\nNow, developers collaborate on more abstract tools - to lessen duplicated effort and improve the over integration among modules.\n
  • Since Drupal 6 - Specific modules are being replaced by the combined features of more generic modules.\n
  • We’ll go into module selection in more detail. but emphasis here, as again, that each module must be maintained.\n
  • The indicators also listed in their manual.\n
  • Search for specific modules, and sort by compatibility.\n
  • Go to an example project page, show what is information is available on the project page.\nWe’ll look at 3 parts of a project page in more detail.\n
  • This information is at the bottom of the project page. Drupal is not backward compatible. What they can see from this listing? Elicit the major version update from 6.x-1.3 v 6.x-2.x. Elicit comparison of the -dev branch.\nThis is the Flag module.\n
  • Project information is a good indicator of health. \nCompare these two projects. What are some differences? \nElicit: Status, reported installs. One is a module one is an install profile. (First is Flag, second is Meetu.)\nJust because only two others use it, doesn’t mean it’s not a perfect solution for you.\n
  • Drupal is software which runs on a webserver. \nIt’s written in PHP, accessing data in a database like this one pictured here. \nIn the core folder, you’ll find a series of text files, such as PHP files, CSS and scripts. \n
  • You can search by version and see reviews here. \n\n
  • The similar modules review group on g.d.o might have comparisons available for you\n
  • This will take 10 minutes minimum.\nThis is an optional section of the presentation. Do this if you have people who have some HTML/CSS experience, or are front end people. \n\n
  • \n
  • Here is an example site with a customized theme. \n
  • Drupal Gardens has a managed theme system. This can be exported (and customized with a sub-theme).\nSo keep in mind it’s different in Drupal gardens.\n
  • A basic theme can be made with a simple .info configuration file, saved into a folder of the same name. \nIn sites/all/themes\nIn this case, the theme is “newlook”. \n
  • When you go to “Appearance” in Drupal’s admin area, you see the disabled theme listed there. \n
  • Enable the theme and set as default to see what happens.\n
  • As soon as you enable it, and view your site you notice something - a “blank” theme in Drupal doesn’t yield a “blank” site.\nOther CMS use tag-based templating so you have to pull in all the content. \nWordpress- a blank theme yields nothing. WordPress is a pull system, where you have to specifically put in tags into templates to see your site. \nDrupal on the other hand is a push system. With this system, you are overriding the output.\n\n
  • In this case, Normalize is a third-party CSS file. And the others are custom.\nYou can add in CSS files this way, as well as JavaScript. \n
  • The CSS files you added to the .info file, are pulled into the system.\n
  • As a final step you’ll make sure to “aggregate and compress” CSS files for performance. \n
  • The order of the regions as declared in you .info file will be the order in which they appear in your Blocks configuration screen.\n
  • \n
  • So far we’ve seen how a basic Drupal theme, even with an .info file inherits the templates of the core and contributed themes. A base theme inherits the template files, CSS and settings of an identified parent theme. \n
  • Many core modules include template files which define how Drupal is rendered. For example the USER module has a user-profile.tpl.php\n
  • This template renders the user profile.\n
  • \n
  • \n
  • \n
  • Based on the naming patterns you can make new templates to add to your theme. What do you think these templates would do?\nRefer to your manual for the key documentation on this.\n
  • \n
  • Caveats of what not to do... putting in SQL queries. Bad. \n\n
  • This will take 10 minutes minimum.\nThis is an optional section of the presentation. Do this if you have people who are developers/coders.\n\n
  • You need to know Drupal site building before you build modules. Reduce duplicated effort and increase the ease of upgrading and maintenance. \n
  • Mostly, end-users interact with the finished products. It’s important they get involved early. \n
  • Editors will be involved with moderating content, but also to some extent, even changing the layout. \n
  • About 80-90% of your work is configuration to create the end products. Selecting projects, configuring them.\n
  • And about 10-20% is going to be working with the platform to create custom functionality. \n
  • When you make a module you choose which events to interact with.\n
  • \n
  • This section is for a more technical audience. You can skip this if you don’t have that audience!\n
  • \n
  • This is one of the key principles of the Drupal project.\n
  • Minor updates are straightforward, go to the “Update tab” on your modules list. You will also see Themes here. \nFirst, download the updates. If they are doing the activities on Drupal Gardens, point out the upgrading is managed for them.\n
  • Now you have a new version of the code files in your directory. This next step runs any require upgrade scripts. This may mean changes to the database, so make sure you backup. \n
  • After you run the scripts, your site will be taken out of maintenance mode.\n
  • Both minor and \n
  • First, you’ll do research. Are the modules you need available? \nNext you’ll prepare and make a backup. When you perform the upgrade you’ll do this in phases, first upgrade core, then contrib. You’ll test and backup as you go.\n
  • This is sometimes a good thing. Drupal encourages module maintainers to eliminate waste of duplicated effort. Often they can pool resources. \n
  • \n
  • This company, Varnish Software, uses their site to generate leads. For example, 1) after you provide your contact information in a webform here, you get access to a whitepaper. \nAt 2) We see a list of topics for browsing content across the site. \n
  • Telenet Group is the largest provider of broadband cable services in Belgium. This is the self-support site for their services. They use Apache Solr to build indexes of content.\nAt 1) We see category blocks. These are generated through Views.\nHowever, at 2) We see “Also interesting for you” a list of related articles generated from the Solr index. This is selected on-the-fly to show related articles based on an index. \nThe most important thing is to help their clients find related information quickly.\n
  • Direct participants to open their manual, and turn to the exercises in Session 3\n
  • Direct participants to open their manual. Do the activity to enable a new module and add a webform.\n
  • \n
  • Do reviews optionally, if you are doing the 3 hour version, or if you want to reinforce some concepts.\n
  • 1. Elicit what this suggests: that editors look through dogs, and select specific ones. If you have a fast group, you might ask someone to search for a solution. After they understand the scenario, you can explain the Flag module. \n2. Elicit what this suggests: That tweets are slurped in. This could be an embedded widget from Twitter, or explain the Twitter module which brings in a feed. \n3. You can use this as a point of departure, and even talk about the things which they’d find if they clicked the “donate” button. \n
  • \n
  • You can skip this if you don’t think it’s appropriate. \n
  • Modules, themes and install profiles/distros are contributed and maintained by people who do this work on a voluntary basis. Of people who use Drupal - 0.05% of people are actually contributing to the project. Now we’ll learn a little bit more about the stories behind the projects. \n\nhttp://www.flickr.com/photos/ceardach/4550842375\nhttp://www.flickr.com/photos/ceardach/4551537132 \nhttp://www.flickr.com/photos/ceardach/4549904317\n\n
  • Open source is more than contributing lines of code, it’s also building relationships and negotiating with others. The more you do in the community, the louder the voice you get. Sometimes we use the phrase “scratch your own itch” and this is often how contributed modules start. Let’s look more closely. \n
  • Stella was a C/Perl/PHP software developer by day, making real-time financial transaction server software. She used Drupal on a personal sites she maintained for fun. She started with the avatar select module, and then took over the Lightbox 2 module to use on her photography site. She has co-organized local meet-ups and regional camps. There are many Drupal success stories like these. She is part of the security team. \n
  • So when you are in the issue queues for a particular module, think of people like Stella and Jacob. Both busy with their work, new companies or new babies, organizing local events and more. \nThere are many ways you can contribute besides code... forum help, issue queue triage, marketing, organizing events, donation, getting sponsorship.\n“Module developers are not gods- they are people like you.”\n\n
  • \n
  • This is DrupalCon in Brussels in 2005. (quickly to next).\n
  • The DrupalCamp recently in Dakar was about the same size.\n
  • And about the same size as this monthly Boston meet-up. \n
  • Cover this if you have a group of students or career switchers. \n
  • \n
  • There are many roles available. From site builders to coders, from visual design to systems administration. \n
  • This is a skills map for learning Drupal. It’s important that everyone knows the Green and Yellow stuff. Then move on to customizations. http://j.mp/drupalskills\n
  • Direct participants to open their manual, and turn to the exercises in Session 4\n
  • \n
  • In addition to the community events mentioned earlier... here are some resources we recommend. \n
  • Starting off at the documentation will cover most bases.\n
  • Since you’re starting out on Drupal Gardens, also check out the documentation on the service. \n
  • If you do purchase books, please do buy them from Drupal.org which gets affiliate bonuses from the purchases. \nD7 module development is a great resource if you are going to attempt custom coding. And the definitive guide is a good reference. It’s VERY big. Recommend to buy it as an e-book. \n
  • If you prefer videos\n
  • Drupal training by Acquia partners is competitively priced compared to other commercial training. You learn with subject matter experts. Please mention training to people for follow on! http://training.acquia.com/ (surprising that many people were coming to Hello Drupal and not hearing that it was available in many places!)\n
  • \n
  • Please give us your feedback before we wrap up. Put this address on the white board so they can still see the link as you answer questions. \n
  • \n
  • If you find you have extra time - direct people to this site to try and figure out how it was done.\n
  • \n

Transcript

  • 1. HELLO DRUPAL! /WELCOME!Download: http://training.acquia.com/hellodrupal
  • 2. LicenseThis work is licensed under the Creative CommonsAttribution-NonCommercial-ShareAlike 3.0 UnportedLicense. To view a copy of this license, visithttp://creativecommons.org/licenses/by-nc-sa/3.0/ orsend a letter to Creative Commons, 444 CastroStreet, Suite 900, Mountain View, California, 94041,USA.Download: http://training.acquia.com/hellodrupal
  • 3. What we’ll do todayINTRODUCTIONDownload: http://training.acquia.com/hellodrupal
  • 4. What we’ll do todayDownload: http://training.acquia.com/hellodrupal
  • 5. What we’ll do1. Short presentation 2. Quick demo 3. You try it Concepts and cases Download: http://training.acquia.com/hellodrupal
  • 6. Learn from cases
  • 7. Hands-on practice
  • 8. Your site 1. 2. 5. 3.4.
  • 9. Getting to know you
  • 10. About us...
  • 11. Our projects
  • 12. Acquia Training• Acquia is “your enterprise guide to Drupal”.• Promoting best practices through training.• http://training.acquia.com/
  • 13. About you...• What sector do you work in?• What web projects do you have coming up?• What are the key audiences for those projects?• How are you meeting those needs now?
  • 14. What you need
  • 15. Check!• Browser with inspection tool, such as Firefox and Firebug.• Optional, but nice: A lorem ipsum generator (in your browser)
  • 16. Check!• Your manual.• “Before you start” in manual • Download the appendix • Your Drupal Gardens site• Browser opened to drupal.org
  • 17. Drupal Gardens vDrupal?
  • 18. Spot the difference
  • 19. UI tweaks - open source
  • 20. Some differences
  • 21. ThemeBuilder
  • 22. Exporting? Yes!
  • 23. A useful tool• Sandbox for us today!• Good for collaboration.• Maintains the server. Updates the software• Implements improvements in Drupal• Provides support in the forums (free) and tickets (paid)
  • 24. Your turn!Change site title
  • 25. Change your site title
  • 26. Session 1WHAT IS DRUPAL?
  • 27. The Lego analogyhttps://twitter.com/#!/tom_eric/status/26847650412
  • 28. Levels of customizationAttribution 2.0 Generic (CC BY 2.0) Attribution 2.0 Generic (CC BY 2.0)By Sirius™ By V&A Steamworkshttp://www.flickr.com/photos/sontranphotos/6305186977/ http://www.flickr.com/photos/32482342@N05/6232526245/
  • 29. Components v KitsAttribution-NoDerivs 2.0 Generic (CC BY-ND 2.0) Attribution 2.0 Generic (CC BY 2.0)by JuditK By creative.paradoxhttp://www.flickr.com/photos/juditk/5879492679/ http://www.flickr.com/photos/edmands/2771878770/
  • 30. Unit 1.1What is Drupal?
  • 31. Drupal is...
  • 32. An online presence
  • 33. A publishing platform
  • 34. A robust search tool
  • 35. Discussion platform
  • 36. Multilingual
  • 37. Citizen engagement
  • 38. Student engagement
  • 39. A digital library
  • 40. Band launch platform
  • 41. A secure URL shortener
  • 42. Service builder
  • 43. Product builder
  • 44. Why choose Drupal1. Compared to other CMSs: • Highly configurable functionality and UX. • Extendable with API and custom themes.2. Compared to frameworks: • Time/effort saved with sub-systems. • Time/effort saves with distributions.3. A large ecosystem of service providers and specialists.4. Large and active community.
  • 45. Highly Configurable
  • 46. Extensible API
  • 47. Customize client UXWorkbench Admin with Rubric theme
  • 48. Sub-systems Featured News About Services Portfolio ContactContent Users Taxonomy CommentsContent title D. Schrute adventure Wow, cant Germany city breakwait to get dwight city break 8 Sept started. J. Halpert Spain sailing joe Me too! shopping 8 Sept text search
  • 49. Distributions (packages) OpenPublish Commons Conference (COD)
  • 50. Specialized serviceshttps://www.acquia.com/partners
  • 51. Active contribution drupal.orgData as of March 2012- Check Drupal.org for updates!
  • 52. A growing community 50 150 750 1350 2250 4200 4751 3000 + 2005 2006 2007 2008 2009 2010 2011 2012Antwerp Vancouver Barcelona Boston DC & San & Chicago & Denver & Brussels & Sunnyvale & Szeged Paris Copenhagen London & Munich
  • 53. Regional and niche http://tinyurl.com/localdrupal http://groups.drupal.org/events
  • 54. Next DrupalCons Munich PortlandAugust 2012 May 2013
  • 55. Unit 1.1 (continued)What’s in the box?
  • 56. The ***P stack http://drupal.org/requirements Drupal is flexible, but most tested on... Linux *, Apache *, MySQL *, PHP * works well with othersCreative Commons Attribution http://www.flickr.com/photos/ftmeade/6134210742/ By Fort Meade
  • 57. AdministrationNext we’ll look at the sub-systems in Drupal.
  • 58. Content editing
  • 59. Blocks: Basic layout tool
  • 60. Roles and permissions
  • 61. Modules for functionality
  • 62. Themes for appearance
  • 63. A closer look (optional)Why do we haveCMSs?
  • 64. Why does it exist?
  • 65. Website maintenance Content and presentation mixed in HTML
  • 66. Database driven
  • 67. Sites are more interactive, social and media rich.
  • 68. CMSs - a step further• Trusted users add and edit content.• Allow power users to manage menus and navigation.• Further: Drupal can be configured to let users modify and manage layouts.
  • 69. Unit 1.2Case: Many kinds ofcontent
  • 70. 1 2economist.com
  • 71. Lots of data• “One Comment a Minute”• Articles, periodical issues, newspapers, customers, user roles, blog posts
  • 72. Migration• Migrate module• Supports migration form other CMS’s (WordPress, Typo3 etc.)• Supports migration from older Drupal versions.
  • 73. direct.gov.uk
  • 74. Requirements • Innovate developer site • Allow developers to submit apps. • Moderate submissions before publishinginnovate.direct.gov.uk/node/add/apps?op=Submit+an+App
  • 75. Field configuration Drupal content type field configuration
  • 76. Unit 1.3 - Unit 1.4 - Your turnAdding blocks andcontent
  • 77. Add a block1 2 3
  • 78. Disabled blocks
  • 79. Add content 1 2
  • 80. Compare• Is the block on the content list?• Can you add comments to a block?• Can you place an article in the sidebar?
  • 81. Unit 1.5How would you do this?Review
  • 82. Tutorial site12 3 Inspiration: http://www.netmagazine.com/tutorials
  • 83. Session 2THE ASSEMBLEDWEB
  • 84. Unit 2.1Thinking like Drupal
  • 85. What you may be thinking example.com news sports politics mental about Your site map masthead contact
  • 86. Structure first? Web Page Title Web Page Titlehttp://domain.com Google http://domain.com Google Front page Full page
  • 87. Structure first? Web Page Title Web Page Titlehttp://domain.com Google http://domain.com Google Front page Full page ?
  • 88. Display of content Web Page Title Web Page Titlehttp://domain.com Google http://domain.com Google Front page Full page
  • 89. Think “Content first”Articles UsersPages Terms Comments “ “
  • 90. Structured content Compare Title Title In HTML: Image upload Body text Body text Tags Location LocationMedia (video, images) Tags
  • 91. Structured content Web Page Title http://domain.com Google Title ImageBody textLocation Web Page Title http://domain.com Google Tags Author Date
  • 92. Structured content Title Show 2 most recent. Image as square thumbnail. Image Body text up to 100 words Web Page Title http://domain.com GoogleBody textLocation Tags Author Date
  • 93. Structured content Title Show 9 per page with pagination. Image as thumbnail. Image Author link to profile. Short date. Web Page Title http://domain.com GoogleBody textLocation Tags Author Date
  • 94. Pages are assembled This is an example of a page that is assembled.
  • 95. Most recent pollEnable the poll Module > Add a poll > Place block
  • 96. Blocks and menus About menu Main menu Custom menus Generated by a module Views listing
  • 97. Block regions Regions
  • 98. Regionshttp://regions.drupalgardens.com/
  • 99. Unit 2.1 (continued)Integration
  • 100. Integration• Existing and popular services? Likely there’s a module.• A proprietary service? There may not be an existing module.• Your unique data source or custom application will require scripting.
  • 101. Drupal + Twitter1 Link to account2 Display feed & archive3 Tweet this button4 Login and tweet library.acquia.com/articles/drupal-integration-twitter
  • 102. Drupal + Facebook developers.facebook.com/1 Just add a “Like” button docs/reference/plugins/like/2 Use Facebook for login drupal.org/project/fbconnect3 Develop FB applications drupal.org/project/fb
  • 103. IntegrationThird party services Socialhttp://drupal.org/project/salesforce http://drupal.org/project/twitterhttp://drupal.org/project/adsense http://drupal.org/project/google_plusonehttp://drupal.org/project/site_verify http://drupal.org/project/mailchimphttp://drupal.org/project/acquia_connector http://drupal.org/project/fbhttp://drupal.org/project/opencalaishttp://drupal.org/project/alfresco Mappinghttp://drupal.org/project/millennium http://drupal.org/project/geofieldMedia http://drupal.org/project/gmap http://drupal.org/project/geocoderhttp://drupal.org/project/media_youtube http://drupal.org/project/openlayershttp://drupal.org/project/media_vimeohttp://drupal.org/project/flickr http://drupal.org/project/locationhttp://drupal.org/project/media_flickr VisitJQuery librarieshttp://drupal.org/project/superfish http://j.mp/3rdpartyDhttp://drupal.org/project/jcarousel for details on third party integrationhttp://drupal.org/project/addtoany
  • 104. Unit 2.2Case: Controllingdisplay
  • 105. 2 31 opensource.com
  • 106. Content displayTeaser Full post
  • 107. How did they do that? Step 1. Step 2. Step 3.Add image Configure Configure field thumbnail field display
  • 108. Add image field
  • 109. Media styles
  • 110. Configure display** Want MORE display modes? Use Display Suite.
  • 111. What else?• Title length• Summary text• Whether tags appear or not• Comment links• Take it further: Display Suite http://drupal.org/project/ds
  • 112. Example: London.gov.uk
  • 113. Unit 2.3 - Your turnCreate contentlistings
  • 114. Create content listing Step 1. Step 2.Select what Configure to display how to display
  • 115. Unit 2.4How would you do this?Review
  • 116. Museum site 21 3 Inspiration: http://fieldmuseum.org/
  • 117. Session 3CONFIGURATIONBEFORE CODE
  • 118. Unit 3.1Extending Drupal
  • 119. “Projects”• Module: Code that alters, extends or enhances Drupal’s base functionality.• Theme: Provides the look, feel, and UX for your site.• Distributions/Installation profiles: Packaged Drupal + Modules, themes and configuration for a use-case
  • 120. Can Drupal do X? This is the Title of the VideoSelect a date One morning, when Gregor Samsa woke from troubled dreams, he December 2011 found himself transformed... More...S M T W T F S30 1 2 3 4 5 6 16:9 URL 7 8 9 10 11 12 13 Embed14 15 16 17 18 19 2021 22 23 24 25 26 2728 29 30 31 1 2 3 0:00 / 4:59 Select TodaySlider Ratings 1 2 3Item Title 1 Item Title 2 Item Title 3 ItemSubtitle 1 Subtitle 2 Subtitle 3 Sub
  • 121. ModulesSoftware to extend the functionality of Drupal. Here are some examples: Fivestar: A content rating system Webform: Submission form Flag: All purpose content marker
  • 122. What is it really?Location in file hierarchy:Drupal core folder/sites/all/modules/
  • 123. Themes © 2010 Acquia, Inc.
  • 124. What is it really?Location in file hierarchy: Drupal core folder/sites/all/themes/
  • 125. “Core”
  • 126. “Core” “Contrib” and “Custom” The more contributed projects you use, the less custom code you need to write.
  • 127. “Core” “Contrib” and “Custom”✖ Don’t hack core
  • 128. A closer lookProject selection
  • 129. Many module categories
  • 130. Clicking together• When choosing a module, consider:• Can you build with existing tools?• Build with Fields and Views? Puzzled By brad montgomery Attribution 2.0 Generic (CC BY 2.0)
  • 131. More is less? • Generic components means additional modules.Attribution-NoDerivs 2.0 Generic (CC BY-ND 2.0) Attribution 2.0 Generic (CC BY 2.0)by JuditK By creative.paradoxhttp://www.flickr.com/photos/juditk/5879492679/ http://www.flickr.com/photos/edmands/2771878770/
  • 132. Previous Create + display events Event module• More generic, flexible solution. Drupal 7• Don’t duplicate effort. Create "event content type"• Standardize Content types administration. and Field (core)• Less dependence on Date field custom code. + Display calendar or listing Calendar Views
  • 133. Take a “maintenance first” approach to project selectionhttp://www.mediacurrent.com/blog/drupal-maintenance-challenge-and-how-manage-it-part-2
  • 134. Key indicators Reputation Reach CurrencyMaintainers other Community around Recent commitscontributions and module? (last 4 weeks)?involvement, Related modules? Recent release?IRC, word of (green/stable)mouth, appearance Number ofin case studies and installations? Issue queueblog posts. responsiveness Integrate with other and maintenance? modules?
  • 135. Module search
  • 136. Project pageWho maintains this?What are current issues?Download linksSimilar projects?Documentation?
  • 137. Downloads andversion numbers
  • 138. Project information Compare
  • 139. Open source - literally
  • 140. DrupalModules.com drupalmodules.com
  • 141. Similar module review groups.drupal.org/similar-module-review “g.d.o”
  • 142. A closer look (optional)Making a theme
  • 143. Making a theme• A combination of configuration and then customizing with code.• What theming in Drupal entails • We’ll take a closer look• What skills you need HTML Advanced CSS Advanced Drupal Site-building Intermediate PHP Beginner
  • 144. An example site
  • 145. Drupal Gardens is different
  • 146. Making a theme in Drupal
  • 147. Overriding a push system
  • 148. Customizing your theme
  • 149. Region order
  • 150. Regions in .info• The regions you define are available in Structure > Blocks
  • 151. Inheritance Templates Core Base theme Sub-theme being called page.tpl.php page.tpl.php page.tpl.php node.tpl.php node.tpl.php node.tpl.php node.tpl.phpuser-profile.tpl.php user-profile.tpl.php
  • 152. Core has template files
  • 153. User profile output
  • 154. COPY to your theme
  • 155. Modify markup
  • 156. Voila!• Drupal first sees your theme’s user-profile.tpl.php and renders it instead of the core user-profile.tpl.php
  • 157. Naming patternsbased on core template pattern custom templatenode.tpl.php node--nodeid.tpl.php node--15.tpl.phpblock.tpl.php block--region-delta.tpl.php block--sidebar-first.tpl.php Docs: http://drupal.org/node/1089656
  • 158. Use machine namesbased on core template pattern custom templatenode.tpl.php node--type.tpl.php node--article.tpl.php
  • 159. Theming Tips• Do not put SQL queries directly into the theme. Not OK. (Make a module).• Follow best practices for configuring content, such as resizing images on the server, and not with CSS.• Do use Style Guide module to reveal the styles used by Drupal.
  • 160. A closer look (optional)Custom coding inDrupal
  • 161. Making a module• Configure first and override.• Reduce duplicate effort!• Custom “glue” for sites.• Skills required: HTML Advanced CSS Intermediate Drupal Site-building Advanced PHP Advanced
  • 162. End-user experience Products They use the product, application or site Functionality User testing happens hereBuilding components Get them involved early Platform Web Framework
  • 163. Editor experience Products Trusted managers Moderate content, Functionality Alter layout, configure the siteBuilding components Make their experience better! Platform Don’t forget to user test with these folks! Web Framework
  • 164. Site building - 80-90% Products Select, install and configure modules Functionality Configure themesBuilding components Configure: A survey A forum Platform A content type Display of content Web Framework
  • 165. Custom coding 10-20% Products Developing modules CSS/HTML for theme Functionality Work with the platformBuilding components Identify “hooks” - Which events? Platform Integrate with other components, APIs Web Framework
  • 166. An event based systemEvent (hooks)A node has just been added ✔A node is showing in an edit form ✔A node is being deletedA form is about to be displayedA user has logged in ✔A user page is about to be displayed ✔A comment has been added ✔ Drupal’s API api.drupal.org/api/drupal
  • 167. What can you do?• Use or create hooks- a simple callback function called on specific events.• Check access control.• Access data, from within Drupal or other datasource.• Insert, update and delete data.• Generate blocks.• Display results, or expose data to Views.• Theme how results or outcomes appear.
  • 168. Product v Framework• Where do I interact with Drupal’s hook system to make custom functionality?• Watch “Taming the Burrito” by Jeff Eaton j.mp/tamelayers
  • 169. Unit 3.1 (continued)Upgrading Drupal
  • 170. The drop is always moving.• Update: Is a minor change, 7.12 > 7.15• Upgrade: A major version 6.x > 7.x• “We can break peoples code, but not peoples data.” • Drupal is not backward compatible. • Data is maintained, upgrade paths available for Drupal core and popular modules.
  • 171. Download updates
  • 172. Backup + run update
  • 173. Update success
  • 174. Drupal upgrades• Both core updates and upgrades must be performed manually.
  • 175. Upgrade process Research Make a backup Perform upgrade data disable non-core Prepare code replace new files update all core upgrade create a test sitelogin user/1 upgrade contribmaintenance mode http://drupal.org/node/570162
  • 176. Caveats• A new version of a module does not mean upgrade path for data.• Sometimes old modules are not upgraded, but moved to a more popular solution.
  • 177. Unit 3.2Case: Configuringfunctionality
  • 178. 1 2varnish-software.com
  • 179. 1 2klantenservice.telenet.be
  • 180. Unit 3.3Configure a newmodule
  • 181. Configure a new module
  • 182. Your webform
  • 183. Unit 3.4How would you do this?Review
  • 184. Animal rescue 31 2 Inspiration http://www.daws.org
  • 185. Session 4OPPORTUNITY ANDCOMMUNITY
  • 186. People like you...
  • 187. Drupal is built by people Photos from code sprints By muir.ceardach http://www.flickr.com/photos/ceardach Attribution 2.0 Generic (CC BY 2.0)
  • 188. Open Source do·o·cra·cy /dōˈäkrəsē/ Noun Responsibilities and and rights granted to those people who do the work rather than elected officials.http://www.communitywiki.org/DoOcracy
  • 189. Meet a maintainerStella Power 2007 Founded in First module 2010 and Started in contributed. employsDrupal as a 5 people HOBBY! Now involved in on 19 projects On Drupal.org: stella http://drupal.org/user/66894
  • 190. How you can help them: Provide clear bug reports/screenshots. Be respectful. Contribute what you can.Stella Power Jacob Singh Stella http://drupal.org/user/66894JacobSingh http://drupal.org/user/68912
  • 191. The communityis growing
  • 192. DrupalCon Brussels 2005Drupal isgrowing By Roland http://www.flickr.com/photos/roland/53700318 Attribution 2.0 Generic (CC BY 2.0)
  • 193. DrupalCamp Dakar 2011By nd1mbee http://www.flickr.com/photos/nd1mbee/5649172387 Attribution 2.0 Generic (CC BY 2.0)
  • 194. Monthly Drupal Meetup in Boston author’s photo
  • 195. Developing your skills
  • 196. Skills in need• Web languages: HTML/CSS/JavaScript• PHP: For module development• Sysadmin/Operations• Performance/Scalability• Visual design for CMSs• User experience design http://bit.ly/mad-skillz
  • 197. Take the quiz! http://bit.ly/mad-skillz
  • 198. Skills Maphttp://j.mp/drupalskills
  • 199. Session 4 - Your turnGet connected
  • 200. Find your people• If you haven’t already - create a user account on Drupal.org• Find a user group or a topical group• http://tinyurl.com/localdrupal
  • 201. Resources
  • 202. Documentation + Planet Also see drupal.org/planet
  • 203. Drupal Gardens docs
  • 204. drupal.org/books
  • 205. drupalize.me
  • 206. training.acquia.com
  • 207. Questions and answersWRAP-UP
  • 208. http://acquia.com/training-feedbackFeedback please!
  • 209. Any questions?
  • 210. How was this done?Preview at http://allnews.drupalgardens.com
  • 211. Go forth and build!By Gábor Hojtsy Attribution-ShareAlike 2.0 Generic (CC BY-SA 2.0) http://www.flickr.com/photos/gaborhojtsy/279354242