LATEST FROM OUR BLOG

Take your daily dose of (only) relevant news, useful tips and tricks and valuable how to's on using the latest web technologies shaping the digital landscape. We're here to do all the necessary information sifting for you, so you don't have to, to provide you with content that will help you anticipate the emerging trends about to influence the web.

How Do You Prepare Your Website for an Upgrade to Drupal 8? 6 Key Steps to Take
Have you had enough of hearing and reading about cutting-edge Drupal's innovative features? About all the improvements that its developers have implemented to this version of Drupal? About its: unmatched functionality   about how it can upload files a top speed   about how it comes equipped with cool multilingual add-ons   about the truly innovative mobile-first mentality that it embeds   and about its goal to cut out the middlemen and empowering the end user even more?   About extended control, put in the hands of developers, builders, content editors and site admins?   And now you want some of all that, too, right?   You want to gain such control over your own site, as well, to supercharge it with such power and to get it aligned not just with the present-day digital trends, but to those of the future, as well. Those that Drupal 8's developers have already anticipated?   Then go ahead! But, before you upgrade to Drupal 8, take some time to go through our set of 6 tips on how to get your site properly prepared for this significant upgrade   Preparation is key for a smooth and effective upgrade to Drupal 8, you know!   1. Before You Upgrade to Drupal 8: Audit Your Current Site   No business/website owner “worth his salt” could possibly have high hopes from upgrading his website if he skips this major step!   How could you project its evolution if you're clueless (or have just a vague idea) of where it's standing right now, from a technical standpoint?   So, before you rush in to install all those “uber cool”, feature-rich Druipal 8 modules on your website, you'd better start building the rock solid foundation of your future Drupal 8 website. Open a forever reliable Google doc. and start filling it up!   Start examining your current website and write down the answers to a couple of key questions:   What sections of your current site do you use most frequently? What sections of your site are barely ever used? Is your current administrative interface user friendly enough? Are there any broken links or inefficient workflows on your site?   Write down everything that you find relevant in your Google doc., ranging from those aspects/workflows on your website that you won't give up to, to all the challenges that you're facing as you're closely auditing it, thoroughly.   Don't forget to write down all your migration-related expectations, as well!   As you and your team will have your moments of inspiration and will “burst” with new innovative ideas that you could implement on your site, make sure to write them down in this soon to become your priceless resource: your Google doc.   You may not realize it now, but this document “locking in” all the key aspects of your current website will be “pure gold” once you delve deeper and deeper into all the other stages of this site preparation for migration process!   2. Keep It Under Version Control    Sometimes it's Drupal's innovative nature itself that could turn into its own weak point!   The “empowering the user” goal, aimed at turning the whole configuration changes into a matter of point and click could also turn breaking up a site into a matter of just a few seconds.   Good news: through its Configuration Management Interface (CMI) Drupal 8 promises to put this possible scenario away for good!   What you can do, for avoiding such an unwanted scenario to happen, is to capture updates via code and to roll them into your production site. Rely on version control and on Drupal 7's Features and Configuration Management modules.   Implementing such a good practice will automatically guarantee you a more streamlined Drupal 8 workflow and a “safety-net” if something wrong happens: you can always roll back those trouble-making changes.   Ever-so-useful practices, like this one, will always watch your back!   3. Re-organize Your Team: Set Up a Modular Workflow    Preparing your team, as well, and not just your current website, is another crucial step of this whole “preparing to upgrade to Drupal 8” process!   Drupal 8's own distinct nature (compared to other versions of Drupal) calls for a far more scalable, modular approach to its CMS design and content authoring.   Therefore your team, as well, should be structured differently.   This calls for a different type of workflow! One where each team's leader gets assigned to coordinate it, to make sure the overall vision gets properly implemented, while each member of the team gets manageable tasks (one class file per developer, for instance).   Separate implementations, several distinct tasks assigned to each team member will put together the Drupal 8's specific workflow: a much more scalable, easy to handle and therefore efficient one.   With each member of your team focusing on a specific part of the project and a leader coordinating the whole team, they'll get to respond to any occurring challenges in a far more promptly manner!   4. Audit Your Current Modules, One by One   With your team now ready to enjoy all the advantages and to handle all the challenges of Drupal 8-specific modular and scalable workflow, it's time to run an audit on your modules, as well!   It's crucial that you have everything, at the modules' level, up to date, before you upgrade to Drupal 8!   Take a close look:   Are there modules on your site that you haven't been using in a long, long time and so, are just taking up space there? Are there deprecated modules on your current website? Are there modules which have been updated on Drupal.org, but not on your website, too?   Take each one of your Drupal 7 modules and closely examine them, discovering which ones are still active, which ones aren't up to date etc.   There might not be an equivalent in Drupal 8 for each one of your Drupal 7 modules, but even so, it is crucial that you have your Drupal 7 ones active and updated.   Are there any custom modules on your current Drupal site?   Then rely on  Drupal Module Upgrader. The command-line will streamline the entire module converting/updating process from Drupal 7 to Drupal 8.   To sum it up, these are the 3 key steps you should take during the module audit stage:   analyze the current status of each one of your modules on Drupal.org discover which ones of your Drupal 7 modules already have a Drupal 8 equivalent available find out what Drupal 7 modules have been transferred to Drupal 8 core   5. Run Security Updates Before You Upgrade to Drupal 8   Is installing the latest Drupal security updates part of your “routine”?    It should be!   It saves you huge amounts of time, especially when you're preparing your site for critical changes, like this one here, when you're about to ugrade to Drupal 8.   Not to mention that it safeguards your whole online presence, your entire business, after all.   Therefore, make sure your site runs on the latest version of Drupal, that both your core and your contributed modules are properly secured. That all the recently patches have been installed before you upgrade to Drupal 8.    You wouldn't want precisely this upgrade to turn into a source of major vulnerability for your website from a security standpoint, now do you?   6. Keep Up With The Latest Module Changes   Get informed before you upgrade to Drupal 8!   This means that you shouldn't rush in to perform the migration until you haven't updated your own knowledge regarding Drupal's modules:   what modules will be part of Drupal 8' core? what modules are already deprecated? what modules are no longer part of the “contrib” section in Drupal 8?   Find out what's new in Drupal 8, in terms of modules: which ones have “leveled up” in the “hierarchy”, which ones are no longer aligning with Drupal 8's mentality and innovative nature and so on.   Find out all about what's changing, what's trending and what's not, anymore, in terms on Drupal modules, before you migrate your website.     This is our set of 6 tips and tricks for preparing your website for a smooth upgrade to Drupal 8. Do you have any other “preliminary procedures” that you usually undertake before migrating your website from one version of Drupal to another? Feel free to share!   ... Read more
Adrian Ababei / Feb 13'2017
Drupal 8 Modules You Should Use
Have you decided to finally turbocharge your existing website with some of all that functionality and innovative features that Drupal 8's been so appraised for? Or maybe it's no migration/leveling up involved, but you're actually facing the challenge of building a brand new company website and you want to “charge” it with some of all that Drupal 8 power and flexibility that the whole community of Drupal developers is so excited about? Then you must be wondering which are the best Drupal 8 modules that you could select for your new or your “to be migrated” website! Your question is more than legitimate, considering all those feature-rich Drupal 8 modules (and there are over 2000 of them!) that this latest version of Drupal is “seducing” you with. And it will continue to get increasingly challenging to choose the very best, considering the fact that Drupal 8 is still a work-in progress. Its community is constantly:   porting modules from previous versions of Drupal building brand new ones  putting together their efforts for making it even more stable and user friendly   Before we go on sharing with you our own list of five best Drupal 8 modules, allow us to give you a good piece of news! It's, in fact, part of the whole boosted functionality and extra cool features “battle plan” that Drupal 8's developers have put together for this version of Drupal: many of the highly popular Drupal 7 modules not only that have been ported to Drupal 8, but they're now in its core!    And now, let's enlist and detail a bit the modules on Drupal 8's “walk of fame”:   Best Drupal 8 Modules to Turbocharge Your Website With 1. Admin Toolbar   Why was there a need for a “new” admin menu? What “flaws” of the original menu needed to be fixed in Drupal 8?   Well, in Drupal 7, even though the admin menu enabled adding drop-down menus, it lacked responsiveness. A mobile-friendly look was greatly needed! One aimed at fixing the “barely visible, hardly clickable on mobile devices” issue of the former drop-down menus.    And so: Drupal 8's Admin Toolbar was born!   It's a fully responsive version, with enhanced drop-down menus functionality, streamlining the admin's workflow: admins can now break the habit of constantly clicking-through in order to get to various sub-menus.    Thus, an easy to use back-end interface for all those user roles in charge with content editing, producing or moderating is now available in Drupal 8!   There's more! Admin Toolbar comes with a sub-module, as well: Admin Toolbar Extra Tools! This one empowers admins to extend their menus' functionality even further: they get to add extra links for running cron, for flushing cache etc.   Talking about Drupal “empowering the user”, right?   2. Google Analytics   Google Analytics is any website owner's “best buddy”. It “obediently” delivers you pretty much any type of reports and comprehensive charts you need for monitoring your visitors' behavior and your site's overall performance.   Still, this is no news for anyone running an online business, especially not for someone operating in the digital “arena” of 2017, right?   Now, what Drupal 8 does, though its Google Analytics module, is that it streamlines your whole data monitoring and interpreting process, since it enables you to analyze your statistics right from your Drupal interface!    This is the “real” news!      3. Token   We couldn't have possibly left out precisely one of Drupal's most popular modules, right?   There isn't one web developer in Toronto, site administrator or website owner who could imagine carrying out their daily tasks without relying on tokens. They're Drupal's ultimate efficiency-boosters!   Acting as placehoders designed for automatically completing the tasks you assign to them, they streamline anyone's work.    Here's probably the most “rudimentary' example for you: a basic token such as [site:name] will automatically insert your website's name!   Basically what the Token module does, is that it supplies those tokens that are not available in core, especially fields, and also an user interface for you to use for scanning through the available collection of tokens.   On a greater scale, this module, one of the very best Drupal 8 modules, can work together with other modules, such as Pathauto, for carrying out more complex tasks, too. Tasks such as providing URL patterns for your whole Drupal website!     4. Devel    Devel is not just another one of the modules on our top five best Drupal 8 modules list: it's a whole “bunch” of sub-modules, in fact. One more “tempting” than the other, both for developers and for Drupal themers.    Let's highlight some of the most popular ones:   Devel Node Access: provides detailed information regarding the node access mechanism of your Drupal installation Kint: a debugging tool designed to display variables and backtraces in a nicely formatted, organize way, thus easing your overall understanding Web Profiler: adds a bottom toolbar presenting you all kinds of relevant stats, such as database queries, which services are being used, cache effectiveness etc. Devel Generate: creates dummy entities, thus populating your test site with images, taxonomy, dummy users etc.     5. Pathauto   What makes Pathauto one of the best Drupal 8 modules?    It's  marks the end of and “era”, the “node/4803” types of links era, and the beginning of a new one! One of the automatically generated user-friendly, easy to remember types of links.   The ones that your users will be more familiar with and that search engine will find easier to discover, read and index, as well.   As for you, say “hello” to a higher ranking in SERP!    “How does it work?” you say?    What Pathauto does, in Drupal 8, is that it generates URL aliases automatically: no more manually created Drupal links from now on.    Moreover (and this is huge!), it enables you (or, better said, it “empowers” you) to change the custom token system generating the URL aliases as you wish!     And this is our list of top five best Module 8 modules! The modules that we rely on for setting up and managing various features of the web projects that we carry out here, in our web design company in Toronto!    Which are your own favorite ones?    ... Read more
Adrian Ababei / Feb 07'2017
Here Is How You Build an Accessible Website With Drupal 8
"Barrier-free access” is carved within the very “DNA” of Internet itself. Therefore, your site, too, should be accessible first and foremost!   Before you even start to make it visually-arresting and useful. Before you even consider how you could add value to your website visitors' lives!   What started as an accessibility-focused initiative in Drupal 7, or better said "as an attempt” to comply with World Wide Web Consortium guidelines, has gradually evolved into a powerful set of accessibility-oriented features in Drupal 8.   Bugs have been addressed, “old” features improved, new enhancements and new features added in Drupal 8 to boost its accessibility in core.   Now let's stop “beating around the bush” and put the facts on the table!   Let us enlist and detail to you these particular accessibility-enhancing features in Drupal 8 that will make your job (building an accessible website) easier than never before:   1. Improved Contrasts   Empathize with those future visitors suffering from colorblindness, then try simulating a context where users would access your website (from their mobile devices) in bright sunlight.   Optimal contrast will “send” an invitation to the users in the above real-life scenarios to keep clicking/scrolling and thus prolonging their visits on your Drupal site.    The great news is that Drupal 8's accessibility maintainers have tackled the contrasts' issue and made the necessary improvements.   2. Controlled Tab Order    It was just yesterday, in our previews post, that we talked about the importance of “blazing your users' path” to the information they're searching for on your website. About easing their “search” with the right UX elements.   Well, this accessibility-boosting feature, in Drupal 8, serves the same purpose.    The Tabbing Manager Javascrip feature is that “flashlight” which will point out the main elements on your website to your visually-impaired or non-mouse visitors.   And this enhancement will make all the difference for them!   Just think about the time and energy that these visitors save by quickly scanning through your tabs instead of striving to navigate through a complex, crowded user interface relying entirely on screen readers!   Zero confusion leads to zero frustrations and to a better user experience for your website's visitors. And this is gold in the age of user experience, right?   3. Inline Form Errors   And this is a truly notable enhancement, which proves that we have come a long way from Drupal 7 when it comes to the support for accessibility available in Drupal 8's core modules.   If in Drupal 7 errors made when users filled in a web form appeared on top of that specific form, while fields got colored in red, as a “warning” sign (not exactly the most effective solution for the visually impaired users), Drupal 8 comes to your rescue with its form inline errors.   In this version of Drupal errors icons get displayed next to the specific fields of the form.   A much needed improvement, wouldn't you agree?   Note: still, the Form Inline Error is an optional Core module, therefore it needs enabling first.   4. Fieldsets for Radios and Checkboxes   When it comes to the Form Api, here's another great enhancement that Drupal's accessibility maintainers “spoil” you with: fieldsets for checkboxex and radios.   Just imagine how this improvement will ease screen readers' (and implicitly non-visual users relying on them) otherwise not at all easy “job” to parse complex forms.   Since related elements get grouped together in Drupal 8, it now becomes a lot easier for you (or your team of Toronto developers) to enhance forms in Drupal.   5. Alternative Texts for Images   Visually-arresting photography and stunning imagery cannot “wow” your visually impaired visitors.    Still, Drupal 8 lends you a hand for helping your users “visualize” and thus “bend before your talent” (or your web designers' talent). How? With its alternative text for image feature.   It's now a required field in Drupal 8, by default: you type in short descriptive text so that all users, without any discrimination, can imagine those visually-arresting images that you'll upload on your website.   6. More Semantics   Semantics! The ultimate impediment that any initiative aimed at enhancing accessibility on your site needs to overcome.   No wonder that one of the ultimate goals of Drupal 8 core maintainers was to “add more meaning to the code”. To enrich Drupal with more semantic HTML elements for the assistive technology to be able to interpret.   And here are the achievements of all the sustained efforts in this direction:   WAI-ARIA landmarks in core (a major step forward)   live regions   roles & properties     Now to name just one example of what “more semantics” in Drupal 8 means, when it comes to accessibility: now screen readers can easily interpret pieces of code such as  <footer>, <header> or <form>.    7. Tables and Views   Speaking of improved semantics, note that the views tables markup is more semantic in Drupal 8.   Let's shed some light on this feature:   it enables you to explain the purpose of a particular table on your website through a <caption> element   it enables you to add a quick “summary” explaining which is the best way to navigate the table and how the data included there is structured; and all this by using the <summary> element   it enables you to use “id” and “headers” attributes and thus associate data cells with header cells   it enables you to “play with” the “scope” attribute, thus to mark your tables' column and row headings   8. Aural Alerts    Animations, color changes, specific text and so on: how do you make visual updates accessible for all users? Even to those relying exclusively on screen readers as intermediates for accessing content on your website?   You rely on Drupal 8's Drupal.announce().   This JavaScript method creates an “aria-live” element on the page enabling instructions to be read to these specific visitors on your site either as assertive or as polite.   9. Hidden Elements    An alternative to CSS styling “display:none” was greatly needed, since this one makes elements invisible both to visual and non-visual users.   And hiding them from everyone is no web developer's (or website owner's) intention!   Therefore, the team “responsible” for Drupal 8's accessibility decided to enable future Drupal users to rely on 3 different classes for hiding certain elements:   “hidden”: for hiding an element from all the visitors on your site “visually-hidden”: for hiding an element from your website's visitors, but keeping it “visible” for screen readers  “invisible”: for hiding an element both from the visitors and from screen readers, without influencing your site's layout   10. CKEditor WYSIWYG Accessibility   CKEditor, too, has been greatly improved in Drupal 8 in the name of empowering users, like you, to generate accessible content on their Drupal websites!   Here are its significant improvements:   the WYSIWYG editor's been upgraded with keyboard shortcuts (for which all those keyboard-only users and power users on your site will “thank you” for)   more semantic elements have been added: for instance HTML 5 tags which enable you to add captions to images   a language toolbar button has been added, enabling screen readers to select the appropriate language for each content    an accessibility checker plugin is now available for CKEditor   And this is precisely how Drupal 8 empowers you to build barrier-free websites that say “welcome” to all visitors, both visual and non-visual!    What do you think of these improvements and new features in Drupal 8?   To what extent do you consider that they'll ease (or have they already?) your job as a Drupal web developer/Drupal website owner? ... Read more
Adrian Ababei / Jan 11'2017
Consider These 5 Aspects When Picking Your Base Theme in Drupal 8
Don't you just feel the sweet taste of new possibilities right now?   And still, any new Drupal 8 project comes with its own set of challenges, as well, and choosing a theme, from the very start, is probably one of the greatest ones.   What should it be then?   Should you go for a classic base theme (AdaptiveTheme or Zen, maybe), for a contributed theme instead or maybe you prefer implementing the framework yourself or build your very own theme, from scratch, relying on Drupal core?   Before you make the decision that will have a huge impact on your whole project's structure, take some time to go through this quick “quizz” here and try to give yourself some clear answers:   are you dealing with a multi-site project (meaning that your theme, once chosen and implemented, will be used across all the other websites, too)?   is the person maintaining the theme a HTML guru or a CSS expert?   will this theme be used just on the website itself or for internal apps as well?   what level of front-end performance optimization does it imply?   Classy vs Stable: Which Base Theme Works Best for You?   This might just be the most important choice to take during your Drupal project's life-cycle!   It's your theme that dictates/overrides your CSS, JS and Drupal's markup, you know. Where do you add that your chosen theme can feature a parent-child relationship, where the sub-theme inherits the base theme's templates, JS and CSS.   In short: think through your theme choice for the sake of your project's success and your whole workflow!   “And still, which one to choose: Classy or Stable?”, you might ask yourself.   Here's how you can tell which one suits you (as a Drupal developer, with certain goals in mind and with a certain theming experience) and your particular web project (which comes with its own set of particularities):   are you planning to add classes only where the context demands them? Then Stable's The base theme for you! do you want lean markup, with very little classes (e.g toolbar and contextual links), giving you the freedom to customize your own markup patterns in your theme, to create only those classes that are required by your project? Stable again, is the “lucky” word, in this case!  do you want to have a set of classes at your disposal, to tweak and use as styling hooks, right from the starting point? Then it "write" Classy all over your Drupal project!   This being said, let's see which are the 5 factors that you should consider before you choose your Drupal 8 base theme:   1. How Much CSS and Markup Updating Does it Require?   How much CSS out-of-the-box does your chosen theme come “equipped” with?   It makes a great difference, you know. Take these two examples for instance:   You decide to build your website on Classy theme, which in Drupal 8 comes with very little core CSS, so you will have to write your own classes and occasionally even to override the templates, depending on what you want your classes to style.    You're building your theme on Zurb Foundation or Boostrap, which come with their own of out-of-the-box classes that all you need to do is apply to your markup. What's important for you to keep in mind, if you incline for this particular work scenario, is that once you have your Drupal site built, there's going to be a lot of template customization to do for adding all those out-of-the-box classes to your site's new components!   2. Has Your Client Expressed Any Preference?   Your client may or may not come with his/ her own preferences when it comes to the theme that you and your team should to build his website on.    Be sure to have one aspect settled with your client, during your before-the-project meetings: are you supposed to maintain the theme that you two will decide upon on the starting point or is there a chance that this should be replaced with a new one, as the project unfolds? It's essential that you discuss this aspect with your client, for it's important for both of you to consider the learning curve (and implicitly the extra time) of each new theme.   In case your client has no specific preferences regarding the theme to be used for his site, your own theming experience and your development process preferences will be the only factors that will influence your theme choice!   3. Consider the Design    It's no news for any developer, no matter his/her level of experience, that Drupal is tremendously flexible! When it comes to theming, it allows you to build practically anything you want: ranging from a large web app, to great customer-facing websites in the latest design and functionality trends!   Depending on what exactly you need to design in Drupal, you get to choose among several platforms:   Ember or Adminimal make some great administrative themes, that will do their job superbly helping you build your back-end app   Zurb Foundation or Bootstrap make great choices if your web project includes components such as tables and forms    4. Will You Be Using a Pattern Library?   A base theme always makes the perfect choice if you're planning to create your own patterns.   In other words: keep it simple, at the theme level, especially if you'll be applying your own classes, which will then get themed by your own pattern library styles!   5. Consider Performance   Less is always better! You keep that in mind and let this common-sense motto guide you through your theme selection!   The more functions, JS libraries and settings your website needs to load, the heavier its “burden” will be (and the longer its load time will be, as well).   Go for a light theme based on Drupal core, which won't come equipped with its own heavy load of out-of-the-box JS libraries and CSS and remember that if less is always more, so does “testing makes it perfect”!   Remember to test all the theme settings on your website, thus keeping its front-end performance closely monitored!     These is our list of factors that any Drupal developer should take into account and think through before choosing the base theme for his/her project. Do you have any other aspects that you usually consider and which determine you to go for a specific base theme or another once you start your Drupal web projects? ... Read more
Adrian Ababei / Dec 12'2016
Get Started: Build Your First Custom Module in Drupal 8
So, you could not resist the temptation to try out the much-praised Drupal 8! You've installed it, you've already “played” with its core modules, its contributed modules and that's it? Don't you think it's about time you leveled up your Drupal 8 skills?   The next step to take is learning how to team up your own skills and knowledge with Drupal 8's full potential for putting together some amazing custom-made modules. Modules that would instantly add extra value to the sites you'll build.   Don't let the “rumors” stating that the whole custom modules building process is so different, and therefore more challenging, from Drupal 7, that it's lengthier and way too discouraging.    We're here to show you that it takes just 8 quick and easy steps for you to create new modules (to meet your sites' specific needs) in Drupal 8! Walk us through all these steps:   1. File Structure    It's under modules folder in the root directory that you should keep both your contributed and your custom modules in Drupal 8:   modules/contrib/   modules/custom/   So, go ahead and get your first custom module started by creating a folder in your Drupal installation at the path: sites/all/modules/custom/sa_module.   Keep in mind: If you're configuring multiple sites, you need to use modules specifically for each one of them:   sites/your_site_name_1/modules/   sites/your_site_name_2/modules/   2. Create the .install file   A Drupal schema (representing one or more tables and their related keys and indexes) is defined by hook_schema(). You'll find it in modulename.install file. hook_schema() and it should return an array mapping ‘tablename’ => array (table definition) for one of the tables defined by the module.   3. Create the .info.yml file    That's right, you have a “info.yml” file extention in Drupal 8 (replacing the “.info file” that you got used to using Drupal 7). It applies to profiles modules and themes, too.   So, that being said, you now need to create your .info.yml file (i.e. sa_module.info.yml), thus letting Drupal know about your new custom module. Your file will look something like this:   name: Drupal 8 custom module example type: module description: 'Example for Drupal 8 modules.' package: Custom version: 8.x core: 8.x   Follow this path for enabling your module: https://goo.gl/ADSWyt OR Click on Extend from Menu.   4. Create the .routing.yml File    When it comes to handling routing in Drupal, you'll be using Symfony 2 components. The routing file that you'll create will help you navigate into Drupal using the method of a controller class (meaning that you'll be specifying different controller actions).    You'll be writing the path in routing.yml file and the resulting file will look something like this:    example.my_page:   path: '/mypage/page'   defaults:     _controller: '\Drupal\example\Controller\ExampleController::myPage'     _title: 'My first page in Drupal8'   requirements:      _permission: 'access content'     1. The first line is the route (a symfony component mapping an HTTP request to a set of configuration variables).   Define your route as a module_name.route_name ‘module_name => sa_module’ ‘route_name => list’.     2. The second line is the path: you'll need to specify the path that this route should register to, in short: the path (of the module) where the users will be redirected. See the leading forward slash “\” in the URL to the route from our example.     3. The third line shows your defaults: you get to specify several things here. For instance, in our above example we have 2 defaults:               _contoller: referencing a method on the ExampleController class                _title: the default page title   You, could, for instance, have "_form" define classes under defaults, as well, helping you define the forms included in your custom module (for example EditForms, DeleteForms, AddForms)     4. The fourth line displays requirements: here you get to specify the type of permissions to be granted to your users for accessing specific pages on your website: “add”, “edit”, “delete” and “access” for instance.   5: Create the .module file     Unlike in Drupal 7, where the hook menu() defines page callback functions, in Drupal 8  it defines menu items exclusively.   Make sure that the path and the route in which in your example.module matches the ones written in your example_module.routing.yml.    Let's have a look at our above-example, for instance: there the route 'route' => 'example.my_page' in example.module should be identical to example.my_page: in example.routing.yml     6: Create Controller Class    First, a few words about “controller”:   it may contain multiple types of arbitrary logic that your site needs for rendering content on a certain page   it's a php function that processes the HTTP request and returns a response   Create a “modules/custom/sa_module/src/Controller" folder and then (within the same folder) a file named AdminController.php.   7. Create Model Class and Forms    Once you've set up your AdminController, you need to introduce a model class (i.e. SaUserInfo.php) in order to link it to your database. It's this model class that you'll create now that will help you set up methods like add(), delete(), update() etc.   8. Create Menu on Admin   One more step and you're ready to launch your very first custom Drupal 8 module right from the Admin Panel ! Create a file sa_module.links.menu.yml, which will set Menu at the Top.     And this is it! 8 quick and easy steps for building your first custom module in Drupal 8! Give it a try! ... Read more
Adrian Ababei / Dec 02'2016
Here Is How You Add Responsive Images To Your Drupal 8 Website
  Proudly wearing its “mobile-first” aura, Drupal 8 is here to help you deal with the issue of responsiveness nice and smoothly. No need to write miles of code anymore, to master the art of pulling off HTML, back-end languages and JavaScrip combos anymore.    In other words: Drupal 8 is here, have no fear! It projects a new world of easy-to-build responsive themes.   It simply “spoils” you with an easy-to use responsive image setup (which comes in its core, another great news). Basically, it puts an image formatter and breakpoint mappings at your full disposal so that you can have your due-sized images, using HTML 5 picture tag, ready in just a few quick steps. Thus, you'll get your images adapted to every device's viewport in no time.   Well, not really “in no time”, but in 5 simple steps! Walk us through this step-by-step demo:   1. Turn on Your Responsive Image and Breakpoint modules You've got that right: the Responsive Image Module is part of core Drupal 8, you get it upon installation and yet, if you want to use it you still have to first enable it. It's the same thing for the Breakpoints module, as well.  How do you enable the Responsive Image Module in Drupal 8 you say?   You go to /admin/modules   You click the check box close to “Responsive Image”   You click the “Install” button   2. Set Up Your Breakpoints “What is a breakpoint?” you say (if you're new to Drupal)? It's a window width that you get to set up, thus letting Drupal know that it should start using a different size image starting from that particular width size. Got it?   Do you remember how things used to be in Drupal 7's Breakpoint module (oh, the (not so) good old days when Breakpoint was a contributed module!)? You could define your breakpoints in your admin interface. Well, not anymore! In Drupal 8 you have to set them up in code.   If it's a pre-built theme that you're using, there's a high chance that your breakpoints are already set up. If you're creating your own theme instead, then you need to set them up yurself in breakpoints.yml file.   So, here is how you set them up (make sure you start with the smallest ones):   your_theme_slug.bannerImage.narrow:   label: narrow   mediaQuery: ''   weight: 0   group: Banner Image your_theme_slug.bannerImage.wide:   label: wide   mediaQuery: '(min-width: 600px)'   weight: 1   group: Banner Image    3. Create Your Image Style  What image styles do you want for each one of your previously defined breakpoints?   Once you've answered yourself that, go ahead and set them up (after you've done a bit of math setting up your breakpoints):   Go to /admin/config/media/image-styles/add   Type in your image style's name (we suggest you go for something descriptive) and click “Save”   Click “Select a new effect” (you'll find it there, under “Effect”, in the next screen that will open up once you've clicked “Save”)   Click “Scale and crop”   Enter the width and height sizes   Click “Add effect” Et voila! Can you go through all this process all by yourself now? For you still have to go back and create image styles for each one of the breakpoints that you've (virually) set up, you know.    And this is how Drupal automatically resizes all the images, that you'll upload on your site, to the image styles that you will have defined. And it doesn't do all this the rudimentary way, no sir: first it sizes the image, then it crops off the extra so that the result should be a perfectly adapted new image (not the stretched or the shrunk, very unnatural looking type)   4. Define Your Responsive Image Style  After you've created images styles for each breakpoint, go ahead and put them all together in a responsive image style.    Go to /admin/config/media/responsive-image-style   Give the “Add responsive image syle” button a click   Give your style a name (go for something easily recognizable)   Select the “Breakpoint group” (you know, the one that you've set up at step no.    Select the breakpoints one by one and associate them each with one image style   Can you see the option for fallback image style there, at the bottom? It's the “default” image that Drupal generates for those browsers that don't support responsive images (such as Internet Explorer 8). We recommend you to select the largest image style!   5. Allocate Your Responsive Image Style to An Image Field Just one more quick step to take and you can upload images on your website and let Drupal do all the formatting/smooth resizing job for you! Before it can do that, you still need to let it know what image field to actually responsify for you:   Click on “Structure”- “Content Types”   Click the arrow close to “Manage Fields” and then click “Manage Display”   Spot your target image field (you'll see the entity type, ranging from taxonomy vocabulary to content type that your image field is assigned to)   Select “Responsive Images” (under “Format”)   Pick one of the responsive image mappings that you will have set up (under “Responsive image style”)   Click “Update”     And that's it! You've provided Drupal 8 with all the settings it needs for “working its magic”: pulling off images of appropriate sizes without comprising their quality. ... Read more
Adrian Ababei / Nov 29'2016
Here is how you do a Drupal 8 migration
Here you are, facing a major challenge: you'll be moving your “precious” site (or your client's site, but still “precious” for him/her and for your own reputation) to Drupal 8! This is process is called: the Drupal 8 migration.   What if something goes terribly wrong? What if you lose valuable information during the process? What if the final look and functions turn out to be less amazing than what you've already heard and read about the highly praised Drupal 8?   No need to freak out, we're here to reassure you: you've taken the best decision!   Moreover, we're here to help you with a risks-minimizing and workflow efficiency-boosting guide that will show you how to upgrade your dear website and have it running in Drupal 8 in no time! It's all about a little bit of planning and putting all the implied processes into place, that's all!   Speaking Drupal 8 migration, just to make it clear, we'd like to mention that: although the whole website migrating process includes configuration migration, updating your websites theme and content migration, too, we'll be focusing on content migration only in this post (by far the most "daunting" one).   Effective Drupal 8 migration: Its 5 Main Phases Before you proceed with any one of your future Drupal 8 migration projects, we strongly advise you to take your time to go over these 5 major steps to take if you want to ensure your projects' success:   1. Audit Your Source Site:  analyze the site to be migrated, see how its content is structured, how it looks, what it uses to examine its taxonomy terms, users, menus, fields, content types, in a few words: don't let anything skip your "inspection"   2. Plan Your Data Model: once you've closely analyzed the source website, it's time you (and your team and client) took some major decisions: what stays on, what should be removed, what corrections/modifications should be performed. To put it simply: it's now that you plan out the content that the future Drupal 8 site will display     3. Get Everything Prepared for Migration: at this stage you'll first overview and then make use of the contributed modules, you'll work with Migrate API, configure and run your migration    4. Put Together Your Migration Strategy: hopefully (for this is the best practice for reducing downtime) at this phase of the whole migration process you'll opt for a near-continuous content migration variant   5. Launch Migration: set up a timeline and be prepared to mitigate any risks that might arise (either before or post launching)   A Drupal 8 Content Migration Example   Before we proceed with the “enlightening” Drupal 8 migration example that we've promised you, let's have a quick look at the modules which will make the whole “transition” to Drupal 8 possible?   Migrate Module: part of Drupal 8 core, this module will serve you both with the content and the site's configuration migration process   Migrate Plus: comes with additional functionality (you get to migrate from XML, JSON and CSV formats)   Drupal Upgrade: it's the one to install if you want to operate in a web interface (which will enable you to specify the files directory and the database of your core site. Once the migration has been completed, you'll get to see all the successfully migrated entities in the report that it will provide you).   Warning!!! Don't forget to back up your future Drupal 8 website!   Now here's that migration example! It briefly describes all the steps to take for migrating the files that Drupal 8's Migration module won't migrate (images here included).   1. Migrate Your Website's Background Let's imagine the following task from your Drupal 8 migration project: you need to import TV shows into Article nodes (from Tvmaze's JSON API).   You'll have to define our YAML file, migrate.migration.shows.yml:    id: shows label: 'TV shows' source:   plugin: json_source   path: 'https://goo.gl/uKiuxw identifier: id   identifierDepth: 1   headers: {  }   fields: {  }   constants:     type: article     format: restricted_html destination: plugin: 'entity:node' process:   title: name   body/0/value: summary   body/0/format: constants/format   type: constants/type   Can you identify the 3 main section here?   source: it informs migrate about the “source” that our content comes from .  destination: it lets migrate know what exactly is it that we want to generate (in the above example: nodes) process: this section informs migrate that it should turn JSON into Drupal fields (summary turns into node body, while the name from JSON becomes the node title)   2. Write a Process Plugin The next step one on our wish list is “adding images”.   Since it's not the URL of the poster image that we'd like to add, but its contents themselves, we face the second challenge of this 3 steps migration process: writing a process plugin (since there's none, already available in Drupal 8, that actually downloads a URL) that will enable us to transform our URL.   So, we inherit from ProcessPluginBase and apply the transform() method which handles $value as a URL.   Next, once we get our plugin's name (file_import), we'll update our process section:   process:   # snip   field_image:     - source: image/original       plugin: file_import   3. Run Migration Here are the 3 last steps to take for finally running your content into the Drupal 8 migration process:   check whether all the proper modules are installed: the Migrate Tools module,  migrate_source_json and the custom one, with the process plugin that you will have already written import your YAML file  run migration with Drush's migrate commands:  drush migrate-import shows   And this is how you migrate images and other types of files (other than SQL dumps or JSON files) to Drupal 8! Was is hard? Do you find the Drupal 8 migration of content a complicated process? Feel free to share your thoughts! ... Read more
Adrian Ababei / Nov 25'2016
10 Steps To Build Your First Drupal 8 Site
  Has all the craze about Drupal 8 got to you, too? Have you started to "fantasize" about it:   tempting easy-to-customize components   HTML5, mobile-first input   quick edit feature   responsive admin   100 languages feature   and all the other "hard to resist to goodies" that the latest version of Drupal comes enhanced with?   Well, my friend, it's time you stopped fantasizing about it, bid farewell to good old, familiar Drupal 7, and level up to Drupal 8.   In order to make this "breakup" easier for you, we've put together a how-to guide that will help you build your very first website in Drupal 8 as quickly as you say: "Drupal!".   You won't believe how quickly you'll have your Drupal 8 site running and looking great!     1. Instal Drupal 8   Before you rush in to install Drupal 8 on your PC, laptop/ server, make sure you have the proper "welcoming" environment for it on your system. I'm referring here to all the must-have software: MySQL, Apache, and PHP.    After all the due preparations, it's time to install Drupal 8! Here's the step-by-step installation process:   Download Drupal 8 (its latest version)   Extract the distribution (from Apache)   Create your database   Then the settings.php and the files directory, too   Run the whole installation process (by accessing your website in your web browser)   Et voila! You've just carried out step no.1. Easy peasy, right?   Now let's hurry up and put together the foundation of your first Drupal 8 website, a foundation made of 4 basic building blocks: Users, Taxonomy, Content Types, Menus.       2. Create User Accounts/Add Roles   Will there be a “one-man show” on your website, meaning that you'll be the one authoring, editing and managing all the content? Lucky you then! You can skip this step, for the admin account that you've got yourself with during the installation process will be the only one you'll need.    If this is your case, then you can just rush in to step 3!   If, instead, you'll be teaming up with a bunch of talented people for creating amazing stuff on your website, then you'll need to create user accounts and assign roles to your colleagues, right?   Here's how you do it in Drupal 8:   A. For creating new users:   Log in on your website's homepage. See the admin menu at the top? Awesome! On the menu there you need to click Manage, then, in the next menu popping up, click People.    B. For assigning roles:   Go to Permissions tab. There, on Permissions page you have a whole list of permissions available for you to assign to the various roles the users on your website will play. Select the permissions to be given to each role (what features/functionality on your website they'll gain access to).   C. For creating new users accounts   Click on the List tab, then on the Add user, fill in the right values and you will have created your first user account, apart from the admin one (which is yours).      3. Create Taxonomy   What's “taxonomy” and why do you need this fancy-named core module for your Drupal 8 site? Because it will help you build up a nicely structured content architecture. Basically, it enables you to organize your content by key terms and phrases related to the specific vocabulary used on your website.   In this respect, Drupal 8 enables you to create vocabularies made of taxonomy terms:   Go to your Admin menu, click Manage, then Structure, and last Taxonomy.    It's in Taxonomy that you get to create one or multiple vocabularies and to“populate” it/them with taxonomy terms.     4. Create Content Types   And here we are, to step no. 4, facing the content's (The King) creation issue.    Will you settle with the 2 core content types that Drupal 8 puts at your disposal upon installation, article, and basic web page, or do you crave a bit more complex templates? Templates that should include a bit more elements for your authors to juggle with than just body and title?   If you've chosen the second variant, then here is how you can quickly make your wish come true:   See the Structure link? Then do you see the Content types link underneath it? Great! Give it a click and a list of both already existing content types and a link for creating a brand new one will unfold before your eyes.   Take it from here, build your customized eye-pleasing content type!      5. Link Content and Taxonomy   OK, so you've put together your taxonomy, you've picked/created your content type, not it's time to connect these building blocks. Here's how:   add a new field to your content type select term reference (this is your field type) click Save double-check that you chose the due vocabulary and the no. of taxonomy terms that goes for each content item   6. Create and Manage Menus   Can you believe this! You're halfway through building your very first website in Drupal 8!   Who could dare underestimate the Menus' value from the user experience's point of you?    Now here's how you get to create and then manage the menus on your future amazing Drupal 8 site:   Go to Structure Click Menus (there, you'll find all the default menus that you got upon installation) Click Edit Menu (in Operations) Click Add Link Once on the Add Menu page feel free to enter your menu's title, to enter a link , too, and so on   7. Work With Blocks   Familiar already (from working in Drupal 7 maybe) with the handling of these boxes of content that you can arrange and rearrange as you want to in different regions of your website?   Now how about finding out how you can juggle with them in Drupal 8?   First of all, if you want to see all the blocks that you've got upon installing Drupal, you need to click the Structure link and then the Block layout link. All the regions (displayed in the left column) are listed there. As for the already available blocks, they're listed in the right column.   When you want to assign a block to a region, you just need to click the specific block name and then select the region that you want to assign it to, from the block configuration page.   But how do you actually create blocks in Drupal 8?   They can get created programmatically by a core, contributed, or custom module   You can create them, as well: go to Block layout page- click the Add Custom Block button   8. Expand Its Functionality    “First” doesn't have to mean “basic”, right?   So, even if you're building your very first website in Drupal 8, maybe you want to boot its core functionality.   Well, in that case, you can stay reassured. With thousands of developers backing up this version of Drupal, constantly improving it, constantly testing it, you'll no doubt find the module to respond to your specific need.    Just go to https://goo.gl/ha9J33, select 8.x and “grab” the module/s that will boost your website's looks or performance!     9. Change Its Looks        Have you heard about Twig? The brand new “thing” in Drupal 8 who's replacing the “old” PHP template?   Why is Twig important for changing the look of your shiny and new site? Well, in Drupal 8 it's Twig that drives the theming system's capabilities, you know!   And since we've uttered the magic word, “theming”, here's a list of ways in which you can theme your website in Drupal 8:   select a pre-built theme  go for a starter theme (which comes with a structure and a set of pre-built capabilities, too) create your own custom theme by making all the needed configuration files   When it comes to installing a new theme, it's nothing but a sequence of 5 quick and easy steps:   Go to Appearance (in the admin menu)   Add a new theme   Download your new theme    Set your new theme as your website's default theme    Easy peasy, told you!     10. Manage Your Brand New Drupal 8 Website   Don't be just another “proud” Drupal 8 website builder, be a future-oriented one. Look for your site and keep it safe (pretty much like its parent)!   “Proactive management" is the golden phrase and here are the tasks to carry out for “proactively” looking after your Drupal 8 website:   review the log files (the Recent log, in your Reports menu will display all the errors logged by your site) back it up  constantly look for updates (Reports Page- click on Available updates) create and disable user accounts check the status report (Reports- Status)     Bravo! Now get yourself rewarded with a cup of coffee! You sure deserve it: you've just (virtually) built your first website using Drupal 8!   If you want to access proactive Drupal support for your development projects, contact Optasy. ... Read more
Adrian Ababei / Nov 23'2016
Drupal 8 Paragraphs: a fast way to build landing pages
It isn’t for no reason that we’ve called Drupal 8 Paragraphs module an “emergency kit” that Drupal 8 comes “to your rescue” with. Not only that it makes building a landing page so very time-efficient, but it “fortunately” limits your creativity freedom.   How come “fortunately”? Because the fewer options you have at your disposal, to distract you and to challenge your creativity, the more focused you are.   To put it simply: it’s the lack of options that sharpen your mind!   It challenges you to take the best decisions in short time while empowering the end user with so much flexibility (he/she can rearrange and edit the content later on). It dares you to come up with an ideally simplified (not necessarily minimalistic, although “extreme minimalism” is such a huge trend these days) result and to put the spotlight on content (that’s right, The King).   Now let us show you precisely how you can use the Drupal 8 Paragraphs module and integrate it into your team’s landing page creation process. Steps to take with Drupal 8 Paragraphs module 1. Get It Running (plus helpful stuff about handling paragraph types and fields) add the Entity Reference Revision and the Paragraphs modules to your website notice that the Drupal 8 Paragraphs module comes equipped with multiple new “paragraph” fields  notice that you get to a theme and to control the way they’ll display on the web page, as well add a new paragraph field on the target Content Type and select the Paragraph Types (Structure  > Paragraph Types) that later on the end user can administer (as a developer you practically get to create precisely those types of paragraphs that your client needs) use paragraphs independent from one another (they’re predefined) although they’re called “paragraphs”, they can take whatever    form/functionality you want; they range from images, headlines, buttons, text blocks, links etc. Each one of them is a different paragraph type with its own “collection” of fields (that you get to define) 2. Build Your Landing Page (Plus An Example) So, you’ve added the Drupal 8 Paragraphs module to your website, you’ve learned about the Paragraphs’ “juicy” features, now let’s get to work (for there was an unreasonable deadline haunting you, remember?)   First, define the paragraph bundles that you’ll be using later (using the User Interface). They come in three “versions:   simple: title+ body field advanced: title+ body+ field collection fields blocks paragraphs: title+ body+ block reference field (the cool thing about this type of paragraph bundle is that the end user gets enabled to add maps, embed sliders, views blocks etc.)   In a nutshell: you select the node you’d like to add your field of paragraph type to, then you choose the paragraph bundle that this specific fields will refer to.   Ok, now let’s imagine that we’re rushing in (we have no choice, the clock is ticking) to create a “call to action” type of paragraph.   Our long experience as landing page “creators” will then instantly unfold a list of a call to action-specific components in our mind: text, link, message.    What do you do then? You add all these fields, that your mind’s informing you about, to your Paragraph Type.    Let’s it sum up:   add your Paragraph Type called “Call to Action”: Paragraph Types- +Add Paragraph Types add all the needed fields (link, title, image and the rest) to your “Call to Action” Paragraph Type: Manage Fields > +Add Field create a content-type landing page and a field of type Paragraph labelled “Call to Action”. Afterwards, from Settings you get to predefine which Paragraph types will be referenced   Probably one of the most alluring features of this module is that it enables you to display even far more complex components (galleries, videos, ads): you simply create a paragraph type of each one of these complex components and then give permission to the end user to reference them.   Reference Type- Reference Method: Default- Type   Note that it’s “none” that you must select from the “paragraph types” drop down menu, so that the user can reference more than just one type.   3. Decide How Your Fields Will Get Displayed There, you have your content added to your landing page and yet: don’t rush in to proudly show your “work-of-art” to your client!   There’s one more fix you still need to do: setting up the way the call to action gets displayed.   Go to Manage Display and do your thing: format and update the order in which those fields will get displayed.   Now it’s just a matter of… filling in the blanks, since all the major configuration and predefining steps have been taken.   When it comes to your landing page’s customized visuals, add CSS and override templates.   Here's An Ultra Efficient Workflow for Building Up a Landing Page 1. Gather and structure all your information and fill in the landing page content form   2. Choose a Paragraph type for each fragment of content   3. Add the elements of design that each paragraph form require   4. Mix and match, edit and rearrange the paragraph entities till you get the desired result   5. Test out the results, of course!   See? Quick and easy!   And although some might say that Paragraphs limits your creativity, in fact, it actually challenges you to be ultra efficient and, given the limited options, to get even more creative. Ironical, right?     What’s your opinion on Drupal 8 Paragraphs module? Have you been using it for building your landing pages so far?  ... Read more
Adrian Ababei / Nov 22'2016