Jul 11 2019
Jul 11

On September 12–14, at Hilton Garden Inn Atlanta-Buckhead

Kaleem Clarkson Kyle Mathews, 2019 DrupalCamp Atlanta Keynote

This year, DrupalCamp Atlanta is honored to welcome Kyle Mathews as our keynote speaker, creator of the open source project Gatsby. Gatsby was a hot topic at DrupalCon this year, and we’re ready to dive into the software at DrupalCamp this September.

Follow Kyle on Twitter and Github.

Session submissions are now open for DrupalCamp Atlanta 2019! With Kyle as our keynote, we’re interested to see how others are combining Drupal and Gatsby. In addition, we’re also accepting sessions in the following tracks:

  • Beginner
  • Design, Theming, and Usability
  • Development and Performance
  • Site Building
  • Business Leadership
  • Education and Training

Each session is 40 minutes with 10 minutes for Q&A. Each room will be set classroom style and will have a projection screen and with in house audio.

Trainings

In addition to 50-minute sessions, we’re also looking for volunteer trainers for our full day of trainings on Thursday (9/12) and a half day on Friday (9/13). Training sessions can range across all experience levels. You can submit your call for training here.

One of our goals for this year’s camp was to increase the number of case studies. We encourage web development companies and units to connect with their clients to co-present a session at this year’s DCATL.

We see this as an opportunity to re-engage with a client by highlighting the great work you have done together all while introducing them to the awesome Drupal community we have. So, reach out to some of our clients and propose a presentation today!

SUBMIT YOUR PROPOSAL HERE

Jul 10 2019
Jul 10

Kanopi Studios is honored to have contributed to Mukrutu, a project that offers a powerful example of the importance of putting inclusivity, cultural sensitivity, and user needs at the center of design and development so that technology can be used as a force for good. 

What is Mukurtu?

Mukurtu  (MOOK-oo-too) is a free content management system built with Drupal that helps indigenous communities manage, share, and exchange their heritage in culturally relevant and ethically-minded ways.

“Mukurtu” is a Warumungu word for safe keeping place, a name chosen in 2007 when Warumungu community members collaborated with developers and scholars on the first iteration of the platform to produce the Mukurtu Wumpurrarni-kari Archive.

Surviving cultures risk being drowned out or forgotten by modern society due to dwindling numbers, resources, and legal claim to land and heritage. By sharing their voices, indigenous cultures can preserve their history and way of life, educate others, and seek much-needed support. But by doing so, they run the risk of losing control and ownership of the narrative. The Mukurtu project helps to solve that problem. Mukurtu was created to allow indigenous cultures to share their heritage on their own terms, eliminating the potential for exploitation or misrepresentation. 

The power of Mukurtu comes from its complex and layered permission system that goes far beyond the capabilities of traditional content management systems. The system is purpose-built to allow indigenous people to maintain control over how information is shared, who they share it with, and how it can be used.

Mukurtu and Kanopi Studios

As the program expanded, Kanopi Studios joined the Center for Digital Scholarship and Curation at Washington State University and CoDA as a development partner. Kanopi led a research-guided approach that included focus groups and surveys with users to inform the project’s technical strategy and development.

Since Mukurtu’s original release, Kanopi has played a lead role in development, adding features based on user requests and ensuring that the system remains easy to use, secure, and scalable. New features include an improved  mobile experience and robust collaboration capabilities with a mobile app coming soon that will allow users to browse and add content from the field, even while offline. 

Kanopi Studios also works directly with clients who want to use Mukurtu, but need to enhance the system to meet unique needs. Custom development examples include a site to help relocate indigenous people in Kivalina, Alaska, another to share the voices of Amiskwaciy people in Edmonton, Canada, and one of our earliest projects with Washington State University.

How Mukurtu can support indigenous communities 

Mukurtu was built to be flexible enough to support diverse communities while remaining easy enough that non-technical users can add and update content and permissions.

Core features include:

  • Traditional knowledge labels allow communities to add labels to content that describe how that content can be accessed, used and circulated, and to whom it needs to be attributed.
  • Cultural protocols allow for finely-grained content access settings that can be customized on an ongoing basis to meet the needs and values of each community, from wide open, to restricted at the individual level. 
  • Community records allow multiple ways to store information about cultural heritage so critical details and diverse perspectives can be maintained. 
  • Data integrity uses file hashes to ensure that files are not tampered with, ensuring that content remains intact over time.
  • Dictionary helps indigenous communities preserve their language, complete with translations, definitions, pronunciations, audio recordings, and other media
  • Collaboration tools allow site members to share events on group calendars and engage in threaded discussions.
  • Unit plans and lessons give educators and students a platform to engage in online and field learning through a Mukurtu site.

Indigenous communities across the globe use Mukurtu to record, preserve, and share their heritage, including the Plateau Peoples’ Web Portal, Passamaquoddy People, Catawba Indian Nation Archives, and many more. 

Impacting our future

While indigenous people benefit from sharing their stories, modern society has much to learn from their cultures as well, from our relationship to the land in a time when climate change threatens us all, to staying connected during this time of individualism and political divide. We’re proud to continue expanding Mukurtu as a platform for telling these important stories and hope they will help us build a stronger future for everyone.

Getting started with Mukurtu

If you have technical support and hosting available, you can download Mukurtu on Github and begin using it for free. For clients who need technical support additional customization of Mukurtu, contact us. We’d love to help.   

Jul 09 2019
Jul 09

In our previous blog - Demystifying the Decoupled Architecture - we discussed how decoupled architecture has become an increasingly popular choice to build enterprise-grade websites.

With various choices available, Drupal gives a breakthrough experience offering powerful content modeling, workflow capabilities and UI creation, helping evolve the marketing, branding and lead generation efforts.

Gatsby js, a React-based site generator, is a great option with Drupal for a decoupled architecture. Drupal and Gatsby form a powerful combination and here’s why this is a great choice.

Why Gatsby?

Let’s learn about the features of Gatsby which makes it an ideal match for decoupling with Drupal.

1. Plugin usage makes life simpler

Plugins help make the site offline, add Google analytics and supports inline SVGs, and much more, making Gatsby extensible and flexible.

Of the different types of Gatsby plugins, the gatsby-source plugins fetch data from a local or remote source and allow it to be used via GraphQL. This implies that almost anything can be used as a source to work with Gatsby and generate static sites.

Some plugins may need only to be listed by name, while others may take options. Gatsby plugin library offers a large number of plugins and continuously being maintained by the community.

2. Progressive Web Apps out-of-the-box

Gatsby enforces best practices to boost performance and add to the smoothness of user experience to give its site users an app-like experience.

The build process creates static HTML files for individual pages which offers swift loading of pages.

Gatsby boots up React on page loading on browser and navigates around your site to give you a single page application experience with near-instant transitions without page reloads. It works by prefetching related page content in the background to nullify any chance of delay on user click.

Gatsby exceptionally improves the client-side experience with JavaScript and can offer offline support with the addition of a single plugin.

3. JAMstack setup

JAMstack setup has taken the web development over by a storm with client-side JavaScript, reusable APIs, and prebuilt Markup offering a great combination to improve the speed and quality of your site as well as the overall developer experience. Gatsby acts as a JavaScript framework for a JAMstack-powered web application.

4. Built with performance in mind

Gatsby framework is built in a way to optimize the website performance on its own and compiles the most performant Webpack configuration to build your site once you create the source code.

It functions by prefetching resources to give a worldclass surfing experience to website users. It follows Google's PRPL (stands for Push Render Pre-cache Lazy-load) architectural pattern which aims to boost your website's performance, especially on mobile devices. The pattern is helpful for structuring and serving progressive web apps (PWAs). You can create PWA with Gatsby by running your page via HTTPS and installing a plugin for the manifest and service worker.

5. Easy to Use and Learn

Gatsby is based on React.js which is a JavaScript library for building user interfaces using components. It's relatively easy to learn, and if you’ve command over JavaScript code, you're good to go.

Working with Gatsby doesn’t require you to learn everything from scratch. Also, you can master working with it even if you don’t have experience working with React or GraphQL. Gatsby has a vast and active community to help you with your concerns.

Benefits of Decoupling Drupal with Gatsby

Static site generators like Gatsby pre-generate all the pages of the website unlike dynamic sites which render pages on-demand alleviating the need for live database querying and running through a template engine. This enhances the performance and brings down the maintenance cost.

Static site generators have seen a growth spurt over the past few years and have been the first preference of developers who wish to build a simple website/blog solution with a minimal server setup and a low maintenance cost.

Drupal proves to be a powerful back-end and is preferred by content editors for its WYSIWYG editor and content types which help them manage content more easily and systematically. However, maintaining a CMS requires hosting a web server and database, which poses security vulnerabilities.

diagram_gatsby_drupal

                                                                     Gatsby in action (Source: Gatsby.org)

Gatsby stands in between the robustness of static site, and the versatile back-end of a content management system. It allows you to host the CMS in-house and publish the content as a static website.

Watch the video to understand how Gatsby helps create blazing fast websites with Drupal:

Headless Drupal- Building blazing-fast websites with React-GatsbyJS + Drupal

Development approach

Gatsby, being a static site generator, lets the public folder created during the build time to behave as a static website.

To make it serve the requests, you can take that folder and deploy it on any server with Apache or nginx like server. Once the build is done, you can down your Drupal server and just deploy the public folder generated during the build.

 

null

 

This means that your Gatsby site will communicate with your Drupal backend during the build time, fetch all the details necessary and create static files for all the paths that will be present on your site.

 

With enterprises choosing to opt for more scalable and flexible experience, the popularity of Gatsby is increasing manifolds.

Are you thinking to implement best decoupled strategy for your next project? Contact our experts to get the best solution tailored as per your needs.

Jul 09 2019
Jul 09

open waters

In this episode of Open Waters, we talk with our own Bob Kepford, creator of the weekly newsletter The Weekly Drop, to discuss Open Source Serverless solutions.  Bob presented this topic at DrupalCon Seattle and it was very well received.  You can catch the recording on the DrupalCon site.

Audio Download Link

Pro Project Pick: Serverless Framework

Interview with Bob Kepford

  • The big question: What is Serverless?
  • What are the 4 pillars of serverless?
  • What are the advantages and disadvantages?
  • What do I have to know to get started?
  • As a site owner, why would I consider using serverless?
  • What are the security implications when using serverless?
  • Who are the big players who are adopting and/or providing serverless solutions?

Subscribe

Apple PodcastsStitcher | Google Podcasts

Jul 08 2019
Jul 08

Part of my day job is to help tune the Cloudflare WAF for several customers. This blog post helps to summarise some of the default rules I will deploy to every Drupal (7 or 8) site as a base line.

The format of the custom WAF rules in this blog post are YAML format (for humans to read), if you do want to create these rules via the API, then you will need them in JSON format (see the end of this blog post for a sample API command).

Default custom WAF rules

Unfriendly Drupal 7 URLs

I often see bots trying to hit URLs like /?q=node/add and /?q=user/register. This is the default unfriendly URL to hit on Drupal 7 to see if user registration or someone has messed up the permissions table (and you can create content as an anonymous user). Needless to say, these requests are rubbish and add no value to your site, let's block them.

description: 'Drupal 7 Unfriendly URLs (bots)'
action: block
filter:
  expression: '(http.request.uri.query matches "q=user/register") or (http.request.uri.query matches "q=node/add")'

Autodiscover

If your organisation has bought Microsoft Exchange, then likely your site will receive loads of requests (GET and POST) to which is likely to just tie up resources on your application server serving these 404s. I am yet to meet anyone that actually serves back real responses from a Drupal site for Autodiscover URLs. Blocking is a win here.

description: Autodiscover
action: block
filter:
  expression: '(http.request.uri.path matches "/autodiscover\.xml$") or (http.request.uri.path matches "/autodiscover\.src/")'

Wordpress

Seeing as Wordpress has a huge market share (34% of all websites) a lot of Drupal sites get caught up in the mindless (and endless) crawling. These rules will effectively remove all of this traffic from your site.

description: 'Wordpress PHP scripts'
action: block
filter:
  expression: '(http.request.uri.path matches "/wp-.*\.php$")'
description: 'Wordpress common folders (excluding content)'
action: block
filter:
  expression: '(http.request.uri.path matches "/wp-(admin|includes|json)/")'

I separate wp-content into it's own rule as you may want to disable this rule if you are migrating from a old Wordpress site (and want to put in place redirects for instance).

description: 'Wordpress content folder'
action: block
filter:
  expression: '(http.request.uri.path matches "/wp-content/")'

SQLi

I have seen several instanced in the past where obvious SQLi was being attempted and the default WAF rules by Cloudflare were not intercepting them. This custom WAF rule is an attempt to fill in this gap.

description: 'SQLi in URL'
action: block
filter:
  expression: '(http.request.uri.path contains "select unhex") or (http.request.uri.path contains "select name_const") or (http.request.uri.path contains "unhex(hex(version()))") or (http.request.uri.path contains "union select") or (http.request.uri.path contains "select concat")'

Drupal 8 install script

Drupal 8's default install script will expose your major, minor and patch version of Drupal you are running. This is bad for a lot of reasons.

Drupal 8's default install screen exposes far too much information

It is better to just remove these requests from your Drupal site altogether. Note, this is not a replacement for upgrading Drupal, it is just to make fingerprinting a little harder.

description: 'Install script'
action: block
filter:
  expression: '(http.request.uri.path eq "/core/install.php")'

Microsoft Office and Skype for Business

Microsoft sure is good at making lots of products that attempt to DoS its own customers websites. These requests are always POST requests, often to your homepage, and you require partial string matching to match the user agent, as it changes with the version of Office/Skype you are running.

In large organisation, I have seen the number of requests here number in the hundreds of thousands per day.

description: 'Microsoft Office/Skype for Business POST requests'
action: block
filter:
  expression: '(http.request.method eq "POST") and (http.user_agent matches "Microsoft Office" or http.user_agent matches "Skype for Business")'

Microsoft ActiveSync

Yet another Microsoft product that you don't why it is trying to hit another magic endpoint that doesn't exist.

description: 'Microsoft Active Sync'
action: block
filter:
  expression: '(http.request.uri.path eq "/Microsoft-Server-ActiveSync")'

Using the Cloudflare API to import custom WAF rules

It can be a pain to have to manually point and click a few hundred times per zone to import the above rules. Instead you would be better off to use the API. Here is a sample cURL command you can use do import all of the above rules in one easy go.

You will need to replace the redacted sections with your details.

curl 'https://api.cloudflare.com/client/v4/zones/XXXXXXXXXXXXXX/firewall/rules' \
  -H 'X-Auth-Email: XXXXXXXXXXXXXX' \
  -H 'X-Auth-Key: XXXXXXXXXXXXXX'
  -H 'Accept: application/json' \
  -H 'Content-Type: application/json'
  -H 'Accept-Encoding: gzip'
  -X POST \
  -d '[{"ref":"","description":"Autodiscover","paused":false,"action":"block","priority":null,"filter":{"expression":"(http.request.uri.path matches \"\/autodiscover\\.xml$\") or (http.request.uri.path matches \"\/autodiscover\\.src\/\")"}},{"ref":"","description":"Drupal 7 Unfriendly URLs (bots)","paused":false,"action":"block","priority":null,"filter":{"expression":"(http.request.uri.query matches \"q=user\/register\") or (http.request.uri.query matches \"q=node\/add\")"}},{"ref":"","description":"Install script","paused":false,"action":"block","priority":null,"filter":{"expression":"(http.request.uri.path eq \"\/core\/install.php\")"}},{"ref":"","description":"Microsoft Active Sync","paused":false,"action":"block","priority":null,"filter":{"expression":"(http.request.uri.path eq \"\/Microsoft-Server-ActiveSync\")"}},{"ref":"","description":"Microsoft Office\/Skype for Business POST requests","paused":false,"action":"block","priority":null,"filter":{"expression":"(http.request.method eq \"POST\") and (http.user_agent matches \"Microsoft Office\" or http.user_agent matches \"Skype for Business\")"}},{"ref":"","description":"SQLi in URL","paused":false,"action":"block","priority":null,"filter":{"expression":"(http.request.uri.path contains \"select unhex\") or (http.request.uri.path contains \"select name_const\") or (http.request.uri.path contains \"unhex(hex(version()))\") or (http.request.uri.path contains \"union select\") or (http.request.uri.path contains \"select concat\")"}},{"ref":"","description":"Wordpress common folders (excluding content)","paused":false,"action":"block","priority":null,"filter":{"expression":"(http.request.uri.path matches \"\/wp-(admin|includes|json)\/\")"}},{"ref":"","description":"Wordpress content folder","paused":false,"action":"block","priority":null,"filter":{"expression":"(http.request.uri.path matches \"\/wp-content\/\")"}},{"ref":"","description":"Wordpress PHP scripts","paused":false,"action":"block","priority":null,"filter":{"expression":"(http.request.uri.path matches \"\/wp-.*\\.php$\")"}}]'

How do you know the above rules are working

Visit the firewall overview tab in Cloudflare's UI to see how many requests are being intercepted by the above rules.

Cloudflare's firewall overview screen showing the custom WAF rules in action

Final thoughts

The above custom WAF rules are likely not the only custom WAF rules you will need for any given Drupal site, but it should at least be a good start. Let me know in the comments if you have any custom WAF rules that you always deploy. I would be keen to update this blog post with additional rules from the community.

This is likely the first post in a series of blog posts on customising Cloudflare to suit your Drupal site. If you want to stay up to date - subscribe to the RSS feed, sign up for email updates, or follow us on Twitter.

Jul 02 2019
Jul 02

As of May 31, 2020, Apigee will no longer sponsor hosting of Drupal 7-based developer portals (D7P). Prior to this, starting on May 31, 2019, Apigee will no longer provision Drupal sites for customers. 

Developer portals are expected to give flexibility and control to the developers and keep users’ data secure on a daily basis.

In our previous blog - Should You Migrate Your Developer Portal To Drupal 8? - we detailed on the security challenges your Drupal 7 developer portal could face, after all, security is important.

In this blog, let us understand the best action plan you can take to secure your developer portal. 

Action Plan to Secure Your Developer Portal

As a service provider, you have developed a set of APIs to provide access to your backend services. The announcement can put you in a fix but whatever your choice of action steps, ensure the end result can: 

  1. Keep your data secure
  2. Should not hamper the current flow of work
  3. Should be able to integrate with Apigee

Currently, you have three options in place:

  • Remain on Drupal 7 and assume hosting responsibility
  • Move to Apigee's integrated portal
  • Migrate your developer portal to Drupal 8

Remain on Drupal 7 and assume hosting responsibility

If you need (more) time to decide whether to opt for migration or not, depending on the existing running projects - you can consider remaining on D7P until you finalize on your choice. 

The support of the modules which integrate Drupal 7 with Apigee Edge will not be affected, however, cloud customers would need to assume direct account responsibility with their hosting providers.

After May 31, 2020, all Apigee-hosted Drupal 7 developer portal will be decommissioned and will be unavailable. You would not be able to administer or develop any post-May 2020. 

Remaining on Drupal 7 could make you vulnerable to several security concerns as discussed in our previous blog.

Move to Apigee's integrated portal

Consider moving to an Apigee integrated portal, if you have been using Drupal 7 with a minimal amount of customization or prefer an all-in-one solution. 

It is integrated directly into Apigee Edge and includes a powerful API catalogue and a compelling markdown-based CMS with robust audience management tools.

However, if you are someone who has leveraged the functionality of Drupal 7 in conjunction with a high degree of customization and investment in crafting a specific developer experience, then you should consider switching to Drupal 8. 

Migrate your developer portal to Drupal 8

Drupal 8 remains to be a compelling option for those who wish to remain on Drupal for their developer portal. It is the option preferred by the customers to head towards a self-managed developer portal and as a path forward to leverage the latest functionalities of Drupal.

There is a host of functionalities in Drupal 8 which makes it a better option from the three. It is more secure than Drupal 7, more features than on Drupal 7 and proves to be an ideal option for the developer portal to be built on. Let’s learn about them.

Your Drupal 8 Developer Portal will be Secure

Here is a list of new features introduced in Drupal 8 which aims to enhance the security of your developer portal:

  • Twigs: A new theming layer which comes with a whole bunch of security features.
  • Configuration management: You have a list of all configurations of your site in your code so as to let you know what all settings have been changed and who is responsible for that, when and why and to know what all settings have been changed.
  • No PHP filter: Simplifies the process by allowing developers to code inside a node.
  • Session IDs hashed: Now session IDs in the code are hashed, so even when the session IDs are known, the sessions cannot be hijacked.
  • Trusted Host Patterns: Code knows when it is in a trusted environment and alerts  when it is not. 
  • Single Statement Limitations to DB queries: Doesn’t allow multiple statement query in a single database.
  • Mixed Mode SSL removed: Implying the SSL will be used anyway and is no way an option now.
  • Automated CSRF token protection: Able to detect if the forms have cross-site scripting going on.

Some Best Practices To Mitigate API Threats

To secure your digital property from any possible threats, you need to follow certain best practices to ensure safe usage of APIs and prevent any critical customer information leakage.

  • Encrypt the APIs: Decrypting the API keys by authorised users will protect the critical data from being misused.
  • Ensure Role-Based User Authorization: Authorizing registered users as per roles to access APIs can work to identify a user and classify them as per varying levels of permissions.
  • Allow only Registered users: The first and foremost step is to authenticate users using the API in order to protect information. It becomes easy to track the API usage and identify who is making what request.
  • Deploy Rate Limiting: It can detect and prevent an unusual number of requests from a given user at a given frame of time. In an exceptional case, wherein the attacker manages to bypass your encrypted authentication and authorization protocols, rate limiting can prevent your API from being compromised.
  • Build Security in Layers: If the above steps don't work, try adding an extra level of security through an outer firewall.
  • Security is required in back-end too: Another checkpoint on the way out of the network can thwart the attacks is to secure the system down up so you can track him down on the way out. 

Srijan Can Help

Srijan is committed to providing customized developer portal to help you attract and engage developers with a comprehensive, customizable developer portal that offers a seamless onboarding experience. We offer secure migration of your existing developer portals to Drupal 8. 

Want to upgrade your developer portal? Let’s start the conversation

Jul 02 2019
Jul 02

“DrupalCamp is a unique experience that you have to attend to understand” 

On the weekend of 15-16 June, I seized the opportunity to be a part of DrupalCamp, that happened in India's capital city, New Delhi. A 2-day camp, it was full of experience from keynote to engaging sessions to Drupal Trivia to a stupendous after-party.

anul-tweetThe fun giveaways at DrupalCamp Delhi captured in an image by Anul Khadija

It wasn’t just my first DrupalCamp, but first Drupal event in general and it is quite true to acknowledge the event by the professionalism and dedication of the organizing team. There were sponsor booths, giveaways and at least three sessions going parallelly at any time of the day.

I was quite amazed to see the event standing by Drupal’s commitment towards inclusiveness with specially-abled artists from Kumawat Pahal Charitable Trust (KPCT) Foundation attending the camp. It was accurate to call the event - Drupal with a cause. As part of the Drupal Association, I understand Drupal’s commitment to all and was pleased to see it happen at the camp.

KPCT-PAINTINGSpecially-abled people from KPCT foundation impressed the audience with their paintings (with feet).
Picture by Ankit Singh

Day 1 started with a prenote by Shadab Ashraf, who took everyone to the early beginning of Drupal and how everything started, followed by an inspiring keynote by Sudhanshu Mani-- the man who had an out-of-the-box idea and lead of the project of Train 18, India’s First Engineless Train -- who enlightened us with some of the biggest challenges and success, followed by plentiful interesting sessions.

The two days were a mix of fun and inspiration. It was compelling to see speakers from various backgrounds speak at the platform with a deeper insight around Drupal and on various cutting-edge technologies.

Additionally, there was a launch of Drupal India Association (DIA), aimed to build more momentum for the local chapter incorporated in India. Being a Drupal Association staff, I believe it is important to have local associations which lead to support the local communities. The DIA will be a great place to collect stories, share resources, and raise the problems that Indian Drupal community faces and together with Drupal Association we can work to better things.

Sunday morning (Day 2) started with a plethora of knowledge shared by camp’s second keynote speaker Prashant Singh, VP - Product Management PayTM, who took us for a ride to the road on lessons and learnings from where to start and what one’s approach should be. He also talked about how to build technology in a startup, followed by another jam-packed schedule, full of regular sessions and workshops.

Birds of a Feather (BOF) was organized to know various chances of challenges commonly faced by some people while contributing. I was surprised to know that infrastructure is also a challenge given the fact that Delhi has many social places.

Came the time for the most special part when Akanksha Singh and I hosted Trivia Night-- a fun-filled part quiz of the event. It was the first time I organized and hosted something like this, which I think was an absolute fun while geeking out. We grouped people into teams and asked them head-scratching questions around Drupal and other trending web technologies.

trivia-nightCandid snap of hosts (Akanksha and I) of Trivia Night by Suhail Lone

I was able to attend a few inspiring sessions given by various founders and co-founders, which motivated me but these three had a lasting impact -

  1. Kickstart your success story by Sarita Chauhan
  2. Serendipity as a Business Strategy by Rahul Dewan
  3. Writing content like a pro by Aditi Syal

I also loved spending in-person time at the contribution sprint where we discussed how to contribute to documentation on drupal.org. Kimi Mahajan did her first contribution by editing a few documentation and improving the content quality. It was exciting to see a happy Kimi making her first contribution.

Contribution sprint is not just for developers, but also for the people who can contribute through non-code to Drupal. This makes us love Drupal even more, as almost anyone can get involved in contributing, making the community vibrant and full of inspirational contributions.

The act of contributing starts from getting involved and connecting with different people involved in various ways to make Drupal better. I found renewed motivation from the sheer joy of learning together and by volunteering to make the camp happen.

The energy and enthusiasm of organizers and volunteers were contagious, and it was inspiring to see them bring great ideas to make the event end on a high note.

Although I’ve been a part of DrupalCamps from quite some time, but from a distance. DrupalCamp Delhi made me realize what I missed. It was encouraging for me to see through my eyes the great work and efforts put in by the community to turn the event into a success.

Drupal community events are an interesting place to be at and I would not want to miss another. Such events give space and resource to get people together under one roof to contribute and giving high-fives in the hallway for their amazing work. I am absolutely looking forward to attending the next Drupal event.

Maybe DrupalCon Amsterdam?

InShot_20190618_121033584

Also revisit the journey at Google drive  -

https://drive.google.com/drive/folders/1-7xbDM7Do5RlaGPVoMXg_6hpS5aCy0qd

Jun 28 2019
Jun 28
Go to the profile of Deirdre Habershaw

Oct 19, 2018

Today, more than 80% of people’s interactions with government take place online. Whether it’s starting a business or filing for unemployment, too many of these experiences are slow, confusing, or frustrating. That’s why, one year ago, the Commonwealth of Massachusetts created Digital Services in the Executive Office of Technology and Security Services. Digital Services is at the forefront of the state’s digital transformation. Its mission is to leverage the best technology and information available to make people’s interactions with state government fast, easy, and wicked awesome. There’s a lot of work to do, but we’re making quick progress.

In 2017, Digital Services launched the new Mass.gov. In 2018, the team rolled out the first-ever statewide web analytics platform to use data and verbatim user feedback to guide ongoing product development. Now our researchers and designers are hard at work creating a modern design system that can be reused across the state’s websites and conducting the end-to-end research projects to create user journey maps to improve service design.

If you want to work in a fast-paced agile environment, with a good work life balance, solving hard problems, working with cutting-edge technology, and making a difference in people’s lives, you should join Massachusetts Digital Services.

Check out some of our current postings here:

Creative Director (posting coming soon, submit your resume here)

Director of Technology (posting coming soon, submit your resume here)

Senior Drupal Developer (posting coming soon, submit your resume here)

Didn’t see a good fit for you? Check out more about hiring at the Executive Office of Technology and Security Services and submit your resume in order to be informed on roles as they become available.

Jun 28 2019
Jun 28

Valuable, easy to navigate, useful and (most of all) usable content. This is the criterion that we use for selecting our favorite Drupal blog posts in a month.

And this is precisely what all the pieces of content that we're about to highlight in this post here have in common.

From:
 

  • inspiring lessons learned while working on a specific Drupal project
  • to actionable insights and valuable advice on how to keep up with Drupal's own advancement
  • to highlighted modules, that make the perfect fit for particular types of projects and challenges
     

… each one of these blog posts provided us with content with... an impact.

But let's just get started: here are the 5 Drupal-related blog posts that won the “popularity contest” in our team this month:
 

Kemane Wright, from Texas Creative, challenges us imagine (or to recall) a scenario where we'd need to remove/style a field in a Drupal form.

Say you:
 

  • find one of your forms to be uneccesarily “cluttered” and you just want to reduce the number of fields for the end-user to fill in
  • just want to update that particular fied's functionality (say turn it from an input field into a select field)
  • realize that there's no module available that you could use
     

Next, he reveals and details upon his 2 solutions to this dead-end, both of them applicable to your code directly.

Now, don't expect me to devulge them to you here. Do head to this team's website and delve deep into the enlightening information there.

Another both useful and usable piece of content that we've added to our list of ressources to tap into. And that because we're on a constant “quest” for new ways of integrating artificial intelligence into our Drupal projects. 

In this respect, we're more than grateful to the InternetDevels team for sharing their selection of Drupal modules that are using AI, all while outlining each one's functionalities.

If the topic of using Drupal for AI applications is of a particular interest to you, we kindly recommend you this post, one of the best Drupal blog posts in June.
 

Justin Toupin, Aten's CEO, is altruistic enough to share with us mortals here, his team's discoveries while working on one of their previous Drupal projects.

More precisely, their set of 6 tools to keep at hand when dealing with data-intensive challenges and data visualization issues.
 

With this post, those at ADCI Solutions launched their “Drupal best practices series”.

For us — and particualrly for the front-end developers here, at OPTASY — it turned out to be a true gem, “stuffed” with valuable best practices on how to optimize one's front-end code:
 

  • segmenting code into smaller chunks
  • integrating dynamic imports
  • ...
     

With everyone asking “How do I prepare for Drupal 9?” these days, Drudesk's piece of content stands out as one of the most useful Drupal blog posts of the month.

It lists all the critical preparations and To-Do's to consider for planning properly for Drupal 9:
 

  • from removing all deprecated code
  • to migrating your website from Drupal 7 to Drupal 8 instead of waiting to take the leap straight to Drupal 9, once released
     

The END!

These have been the 5 Drupal blog posts in June that had an impact here, at OPTASY:
 

  • on how we'll be using Drupal from now on
  • on how we'll be approaching our future Drupal projects
  • on how we'll improve our workflow to incorporate the best practices and the useful Drupal tools highltihed in these posts

Photo by Tony Hand on Unsplash

Jun 28 2019
Jun 28

Just imagine: you update content on one of your Drupal websites and content across your whole network gets automatically synchronized! That's Drupal on Blockchain in just a few words...

Say you manage a national library's infrastructure of Drupal websites. One for each one of its local branches.

Now, here's how moving all the user data stored in there from your centralized database onto a decentralized blockchain system would benefit you:
 

  • readers get to validate their own user data since there's no central entity having full (and exclusive) control over it
  • once they've updated their user data on one of the library's websites, it'll get synchronized across the entire network
  • the well-known vulnerability to errors of centralized multi-site structures gets eliminated; there's no longer a centralized database acting as a single point of failure
  • the decentralized architecture speeds up any operation that gets performed across the network
  • you'd avoid scenarios where the same reader enters his login credentials on one of the library's websites and gets asked to enter them, once again, when accessing the website of another library branch
     

And I would also add: increased transparency, lower transaction costs...

But I'd better dive into more details on how Blockchain and Drupal can work together and how you can benefit from the decentralized architecture that they'd put together:
 

1. Blockchain: What You Need to Know About Its Potential

But first, here's Blockchain in plain words:

A decentralized shared system where multiple participants store their data, interact directly with each other, manage and keeping a record of their transactions.

How is it different from the “old” way of managing transactions across a network?
 

  • there's no more a centralized database for storing data and transactions; participants (nodes) store it among themselves
  • … this grants them total control over their own data/created content
  • users involved in a blockchain network get to interact with one another freely, with no need of a third-party as an intermediary
  • it establishes a system of rule-based transactions
  • each transaction — editing, deleting content, etc. — gets documented
  • it enhances communication between nodes/participants
  • transactions get carried out at higher speed and, implicitly, with fewer costs
  • with no central entity as a unique storage source, there's no single source of failure anymore
  • enhanced transparency
     

In short: blockchain enables you to set up a secure and immutable architecture for your network.
 

2. Blockchain and a New Content Distribution Model

“Transparency” is the keyword here. Decentralizing a content distribution platform would benefit both content creators and content consumers:
 

  • digital publishers become the only ones allowed to update or delete their own content
  • consumers pay producers directly for the content they consume (written content, songs, videos etc.)
     

This way: content creators get full control over their own content — there's no platform owner who could remove it to his/her liking — and get paid fairly and in real-time, for each piece of content that gets “consumed”.
 

3. Drupal on Blockchain: Why, How, and With What Costs?

Why would you want to decentralize your CMS — in this case, Drupal — and store your data on Blockchain? 

To answer your question, let me highlight just a few of the inconveniences of managing your content on a centralized Drupal database:
 

  • each transaction is explicit and irreversible
  • it poses a higher vulnerability to errors
  • multiple-user functionality can turn out to be a serious dread
  • the centralized database acts as a single point of failure: if something crashes in there, the whole system is at risk
  • updating content in your database doesn't automatically update it across your entire network of Drupal websites...
     

And how would the 2 technologies work together? Considering the fundamental differences between them:
 

  • Drupal uses a centralized architecture to manage content
  • Blockchain uses a decentralized, middleman-free workflow based on a verification element
     

Before I try to answer your legitimate question, let me ask you this:

Do you seize any similarity between Drupal's “open data” phylosophy and Blockchain's “decentralized data” principle?

Now, here's how your hypothetical “Drupal on Blockchain” architecture would look like:
 

  • it'd be a much more secure, decentralized structure (you'd remove the single point of failure, remember?)
  • since a blockchain workflow would use an immutable validation of data, it'll act as a guarantee that no content can get modified by other than its creator/distributor
  • user data/content would be easily accessible across the entire infrastructure (take the example of an enterprise-level business, running a multi-site Drupal network)
  • … and it'd synchronize in real-time across all your Drupal instances, as well...
  • transactions performed within this architecture would be rule-based: every single content update or removal will get documented
     

“But at what costs?” you might ask. What compromises would you need to make to run Drupal on Blockchain? 

What challenges should you get prepared for?

Here are 2 potential “dares” to ponder upon:
 

  • first of all, integrating your current Drupal data into a blockchain system won't be quite a “piece of cake”
  • secondly, getting the consensus of all the participants (say users whose data would be easily accessible network-wide) is also a serious issue to consider
     

4. Drupal Development Efforts in this Direction: The Blockchain Module

This duo — Drupal and Blockchain — has generated quite a lot of talk these years. And quite a handful of promising initiatives and even prototypes have been presented (integrations with Etherium and bitcoin...)

From all these initiatives of the Drupal community, I've decided to put the spotlight onto the Blockchain module (not yet covered by Drupal's privacy policy).

Take it as a “scaffolding” to support your future “Drupal on Blockchain” architectures. It provides the functionality you need to:
 

  • set up your Drupal installations as blockchain nodes; ”nodes” that are independent, meaning they can get configured independently
  • ensure that your newly set up nodes are compatible with each other
     

The END!

This is the “why, how and at what costs” of this topic. One which has been on the lips (and on the Drupalcon slides) of members of the Drupal community for quite a while now.

What do you think?

Would such a decentralized Drupal on Blockchain architecture suit your own project's needs and constraints? Would you trade your central point of storage for the convenience of automated content synchronization?


Photo by Clint Adair on Unsplash

Jun 21 2019
Jun 21

This is no news anymore: preparing to upgrade to Drupal 9 is just a matter of... cleaning your website of all deprecated code. 

No major disruption from Drupal 8. No more compatibility issues to expect (with dread)...

“Ok, but how do I know if my website's using any deprecated APIs or functions? How do I check for deprecations, identify them and then... update my code?”

2 legitimate questions that must be “haunting” you these days, whether you're a:
 

  • Drupal 8 website owner
  • developer currently working on a Drupal project
     

Since the great news of this smooth Drupal upgrade ships with the answer to your “What” question (“What do I do to get my website ready for Drupal 9?”), but leaves the “How” question open:

“How precisely do I check my website for deprecated code?”

Are there any analysis tools available? Tools that you could run to get a thorough and accurate deprecated code report? 

Luckily, there are. And I'll be focusing on 2 of the most effective ones that you should consider integrating into your workflow: Drupal Check and the Upgrade Status module.
 

1. But What Is Deprecated Code? And What Website Elements Should You Audit?

A piece of code is considered deprecated if:
 

  • there's an upgraded alternative for it already available
  • it's no longer in use
     

With this real “dilemma” now solved, there comes another one:

“What parts of my website should I check for deprecated code?”

Make sure you scan your:
 

  • Drupal core
  • Drupal modules
  • theme
     

Note: pay special attention to the contributed modules enabled on your Drupal 8 website; run a deep-scan and, if you get any deprecation warnings, make sure to alert those modules' maintainers to clean them up.
 

2. Drupal Check: Scan Your Database for Any Deprecations 

A handy PHP analysis tool to grab and to run whenever you need to look for deprecated code in your database. 

A command-line tool that Dries Buytaert recommends running the... automated way,  closely integrated into your own workflow. What it'll do is track down instances of deprecated code for you.

Then, all there's left for you to do is to... remove them. And, depending on the context, to replace them with their upgraded alternatives.
 

3. The Upgrade Status Module: Determine Your Site's Readiness to Upgrade to Drupal 9

If the idea of working with a command line doesn't sound too... “tempting” to you, how about adding a user-friendly graphical interface to the equation?

The Upgrade Status module, delivered to us by the Aquia team, lead by Gábor Hojtsy, makes checking for deprecated code a lot more enojyable and intituive, thanks to its admin dashboard.

It's particularly handy if you're a Drupal site owner and not a senior Drupal developer highly familiar with CLIs.

Install it, enable it and use it to evalute your website and to assess to what degree it is ready (meaning up to date) for the Drupal 9 upgrade.

But let's delve head first into details on:
 

  • what it takes to install it properly
  • what parts of your website it will deep scan
  • how you can narrow down its analysis to specific projects only
     

3.1. Use the Composer Package Manager to Install It

Since it ships with its whole collection of third-party PHP dependencies...

Another key requirement to set the stage for the Update Status module is to enable the Update Manager and the Git Deploy modules on your Drupal 8 website.

Once installed, you can access its user interface at /admin/reports/upgrade.
 

3.2. Check Up Your Codebase, Modules and Themes

The great thing about this module is that you get to run your checks right in your admin UI and get a full report.

Another great aspect is that, when it comes to contributed modules, it will provide you any available updates... inline. 

Once it's completed its scan it'll display either an “Errors found” or a “No known errors” message. To localizae the identified deprecations on your website, just click “View errors”.
 

3.3. Run It on Specific Individual Projects, Too

Maybe you don't always need a full check. Maybe you'd like to scan only a specific project that you might be working on, to ensure that it's ready to upgrade to Drupal 9 when due time.

You can do that. The module allows you to cut down the time you'd spend on an uneccessary full-scan by focusing on one target project only. 

Furthermore, to streamline things even more, it enables you to export each deprecated code report individually...
 

4. So,You'Ve Identified Your Deprecated Code: What Next?

In most cases, keeping your codebase up to date once you've detected the deprecated parts is just a matter of replacing those deprecations.

For the other few cases left, you'll need to carry out a more complex refactoring process.

Now that you know which are the tools to use for:
 

… your website's smooth upgrade to Drupal 9 depends on you exclusively. 

On sticking to your own routine of checking up your Drupal core, modules and theme and keeping them up to date.

Image by fajar budiman from Pixabay

Jun 21 2019
Jun 21

I am working with a customer now that is looking to go through a JSON:API upgrade, from version 1.x on Drupal 8.6.x to 2.x and then ultimately to Drupal 8.7.x (where it is bundled into core).

As this upgrade will involve many moving parts, and it is critical to not break any existing integrations (e.g. mobile applications etc), having basic end-to-end tests over the API endpoints is essential.

In the past I have written a lot about CasperJS, and since then a number of more modern frameworks have emerged for end-to-end testing. For the last year or so, I have been involved with Cypress.

I won't go too much in depth about Cypress in this blog post (I will likely post more in the coming months), instead I want to focus specifically on JSON:API testing using Cypress.

In this basic test, I just wanted to hit some known valid endpoints, and ensure the response was roughly OK.

Rather than have to rinse and repeat a lot of boiler plate code for every API end point, I wrote a custom Cypress command, to which abstracts all of this away in a convenient function.

Below is what the spec file looks like (the test definition), it is very clean, and is mostly just the JSON:API paths.

describe('JSON:API tests.', () => {

    it('Agents JSON:API tests.', () => {
        cy.expectValidJsonWithMinimumLength('/jsonapi/node/agent?_format=json&include=field_agent_containers,field_agent_containers.field_cont_storage_conditions&page[limit]=18', 6);
        cy.expectValidJsonWithMinimumLength('/jsonapi/node/agent?_format=json&include=field_agent_containers,field_agent_containers.field_cont_storage_conditions&page[limit]=18&page[offset]=72', 0);
    });
    
    it('Episodes JSON:API tests.', () => {
        cy.expectValidJsonWithMinimumLength('/jsonapi/node/episode?fields[file--file]=uri,url&filter[field_episode_podcast.nid][value]=4976&include=field_episode_podcast,field_episode_audio,field_episode_audio.field_media_audio_file,field_episode_audio.thumbnail,field_image,field_image.image', 6);
    });

});
jsonapi.spec.js

And as for the custom function implementation, it is fairly straight forward. Basic tests are done like:

  • Ensure the response is an HTTP 200
  • Ensure the content-type is valid for JSON:API
  • Ensure there is a response body and it is valid JSON
  • Enforce a minimum number of entities you expect to be returned
  • Check for certain properties in those returned entities.
Cypress.Commands.add('expectValidJsonWithMinimumLength', (url, length) => {
    return cy.request({
        method: 'GET',
        url: url,
        followRedirect: false,
        headers: {
            'accept': 'application/json'
        }
    })
    .then((response) => {
        // Parse JSON the body.
        let body = JSON.parse(response.body);
        expect(response.status).to.eq(200);
        expect(response.headers['content-type']).to.eq('application/vnd.api+json');
        cy.log(body);
        expect(response.body).to.not.be.null;
        expect(body.data).to.have.length.of.at.least(length);

        // Ensure certain properties are present.
        body.data.forEach(function (item) {
            expect(item).to.have.all.keys('type', 'id', 'attributes', 'relationships', 'links');
            ['changed', 'created', 'default_langcode', 'langcode', 'moderation_state', 'nid', 'path', 'promote', 'revision_log', 'revision_timestamp', 'status', 'sticky', 'title', 'uuid', 'vid'].forEach((key) => {
                expect(item['attributes']).to.have.property(key);
            });
        });
    });

});
commands.js

Some of the neat things in this function is that it does log the parsed JSON response with cy.log(body); this allows you to inspect the response in Chrome. This allows you to extend the test function rather easily to meet you own needs (as you can see the full entity properties and fields.

Cypress with a GUI can show you detailed log information

Using Cypress is like having an extra pair of eyes on the Drupal upgrade. Over time Cypress will end up saving us a lot of developer time (and therefore money). The tests will be in place forever, and so regressions can be spotted much sooner (ideally in local development) and therefore fixed much faster.

If you do JSON:API testing with Cypress I would be keen to know if you have any tips and tricks.

Jun 20 2019
Jun 20

What does Drupal 8 do that Laravel does not? What key functionalities, that Drupal ships with, do you need to build from scratch in Laravel? And how would opting for Laravel benefit your specific type of project? In short: Laravel or Drupal 8?

“It's like comparing apples to oranges” some might say since one's a framework and the other one a CMS.

Even so, if it's unclear to you what are their particular use cases and their built-in features, you can't know whether it's a CMS or a framework that best suits your project type, right? That best serves your project-specific needs:
 

  • to be super fast
  • to leverage a solid, off-the-shelf content management system for publishing different pieces of content on the website
  • to feature an easy to scale database
  • to support multisite
  • to tap into robust user and content management features that are already implemented
  • to be built on top of a solid framework acting as a reliable back-end application
  • to leverage a highly intuitive admin user interface
  • to be 101% secure
  • to leverage a mixture of server and client-side logic
     

Now, keep your list of project requirements and constraints at hand to evaluate these 2 technologies' pros and cons against it:
 

1. Drupal 8: Top Benefits, Main Drawbacks, and Specific Use Cases

If a robust user and content management system is critical for your project, then Drupal 8 makes the smartest choice. It's that “thing” that Drupal excels at that, which would take you a whole lot more time to do in Laravel.

And it's not just its robustness that might “lure you in”, but the level of convenience that it provides: a lot of the essential features and functionalities that you might need are already built-in.

Moreover, you can easily manage them and custom-tune them via your admin interface...

By comparison, you'd need to build these functionalities, from the ground up, if you chose to go with Laravel.
 

Top benefits:
 

  • you can rest assured that your website runs on a particularly robust, Symfony-based CMS
  • there's a huge, dedicated community backing it up
  • you get to create various content types, for different parts of your website, assigned with different roles; unlike basic CMSs, that only enable you to write... posts and to create new web pages
  • you can set up different editorial workflows and assign specific user roles, with fine-grained access control
  • you can always further extend its CMS-specific functionalities: extensibility is one of the strongest Drupal 8 benefits
     

Main drawbacks:
 

  • you do need a team of Drupal experts (senior-level preferably) to keep an eye on your Drupal 8 website/app and keep everything properly maintained
  • you can't get away with a “get it up and running and... move on” type of philosophy; Drupal 8 is a more of a long-term commitment: there's always a newly launched promising module to consider adding on, a new update to run...
     

Specific Use Cases for Drupal 8:
 

  • large-scale projects that depend on a robust and reliable content management system; one that withstands an intense, ongoing process of creating, editing and publishing lots of fresh content
  • Laravel or Drupal 8? Definitely the later if it's a multi-site, multi-language web project that you plan to develop; not only that it streamlines content publishing  across your whole network, but it significantly speeds up localization thanks to its server-side caching capabilities
     

It means that no matter the place on the globe where that your users might be located, they get to access your web pages and have them loaded... instantly.
 

2. Laravel: Pros, Cons, and Project Types that It's Best Suited For

Laravel stands out as a highly reputed, powerful PHP framework

If:
 

  • maintainability is one of your biggest concerns
  • you're looking for a robust framework
  • you need to carry out your project fast enough
  • you need a framework that ships with all the latest functionalities
     

... then Laravel is what you need.
 

Top Benefits:
 

  • a fast-growing, devoted community
  • you can easily integrate LDAP authentication 
  • it leverages the Model-View-Controller architecture
  • it's just... fast
  • provides you with a great admin user interfaces
  • it “spoils” you with intiutive, beautifully written code
  • it ships with a heavy “toolbox”: scan through and pick the most suitable one(s) for your project
  • in-built code for social login and sending out emails
  • everything you might need to set up during the development process is right there, already integrated into your code: cron jobs, database queries, routes...
     

Main drawbacks:
 

  • more often than not identifying performance issues isn't that straightforward
  • upgrading to the latest version of Laravel can turn out to be quite a challenge: be prepared for “buggy scenarios” and for the need to rewrite code
  • you can't just jump straight to Laravel: learning the basics of OOPS first things first is a must
     

Specific Use Cases:
 

  • your project needs a back-end application (rather than an off-the-shelf CMS)
  • when the benefits of the MVC architecture (faster development process, suitable for large-scale projects, multiple views, etc.) are critical for the given project 
  • whenever you need to mix the client-side with server logic
  • whenever time factor is the main concern for you: you just need your project developed super fast
     

3. So... Laravel or Drupal 8? 

Now, I'm sure that you already anticipate my answer:

The choice depends strictly on your project requirement and objectives.

On your own hierarchy of priorities in terms of features and functionalities.

And depending on these key aspects, that should be clearly defined, one technology will benefit you over the other.

So... what type of project are you looking to build?

Photo by Raquel Martínez on Unsplash 

Jun 20 2019
Jun 20

We’ve been starting many of our projects using Acquia’s Lightning distribution. This gives a good, consistent starting point for and helps speed development through early adoption of features that are still-in-the-works for Drupal 8. Like other distributions, Lightning bundles Drupal Core with a set of contributed modules and pre-defined configuration.

While Lightning is a great base to start from, sometimes you want to deviate from the path it provides. Say for example you want to use a Paragraphs based system for page components, your client has a fairly complex custom publishing workflow, and you also have different constraints for managing roles. Out-of-the-box, Acquia Lightning has a number of features you may find yourself in conflict with. Things like Lightning Layout provide a landing page content type that may not fit the needs for the site. Lightning Roles has a fairly hard-coded set of assumptions for role generation. And while it is a good solution for many sites, Lightning Workflow may not always be the right fit.

You may find yourself tempted to uninstall these modules and delete the configuration they brought to the party, but things are not always that simple. Because of the inter-relationships and dependencies involved, simply uninstalling these modules may not be possible. Usually, all looks fine, then when it comes time for a deployment things fall apart quickly.

This is where sub-profiles can save the day. By creating a sub-profile of Acquia Lightning you can tweak Lightning’s out-of-the-box behavior and include or exclude modules to fit your needs. Sub-profiles inherit all of the code and configuration from the base profile they extend. This gives the developer the ability to take an install profile like Acquia Lightning and tweak it to fit her project’s needs. Creating a sub-profile can be as easy as defining it via a *.info.yml file.

In our example above, you may create a sub-profile like this:

name: 'example_profile'
type: profile
description: 'Lightning sub-profile'
core: '8.x'
type: profile
base profile: lightning
themes:
  - mytheme
  - seven
install:
  - paragraphs
  - lightning_media
  - lightning_media_audio
  - lightning_media_video
exclude:
  - lightning_roles
  - lightning_page
  - lightning_layout
  - lightning_landing_page

This profile includes dependencies we’re going to want, like Paragraphs – and excludes the things we want to manage ourselves. This helps ensure that when it comes time for deployment, you should get what you expect. You can create a sub-profile yourself by adding a directory and info.yml file in the “profiles” directory, or if you have Drupal Console and you’re using Acquia Lightning, you can follow Acquia’s instructions. This Drupal Console command in Lightning will walk you through a wizard to pick and choose modules you’d like to exclude.

Once you’ve created your new sub-profile, you can update your existing site to use this profile. First, edit your settings.php and update the ‘install_profile’ settings.

$settings['install_profile'] = 'example_profile';

Then, use Drush to make the profile active.

drush cset core.extension module.example_profile 0

Once your profile is active and in-use, you can export your configuration and continue development.

Jun 17 2019
Jun 17

open waters

Mediacurrent is proud to announce the launch of our new podcast with the release of our pilot episode. Open Waters is a podcast exploring the intersection of open source technology and digital marketing. It’s made especially for CMO's, Directors and Managers of Marketing, technology, and digital strategy.

Our Purpose

We think open source is an ocean of opportunity to maximize your martech investment. 

We encourage you to listen and learn about using open source technology and forward thinking marketing strategy to generate and convert leads, improve security, increase speed to market, and identify the ROI of your digital investments. Our goal is to educate about the challenges and solutions we see with our own clients and in the market.

Welcome to Open Waters - Episode 0 

Dive in to our pilot episode!

Audio Download Link

In this episode:

  • New format, shorter but more frequent episode release schedule.
  • We're taking a different direction from our Mediacurrent Dropcast, no longer focused strictly on Drupal. Instead, we will be talking about the business benefits of open source software.
  • We are going to change up some sections. A little less news, and more about solutions.
  • We will probably still do the Pro Project pick from our Dropcast
     

Upcoming Episodes:

  •  Ben Robertson, who presented at the GatsbyJS Days conference in December, will join us to talk about the benefits of Gatsby JS.
  • Mario Hernandez will be on the podcast to talk about our upcoming expanded training for components. 
  • We’ll have an episode to talk about how to choose a CMS, whether it’s Drupal, WordPress, or any of the other bazillion options.
  • Bob Kepford, you may have heard of him, will be on to talk about serverless 101 and the problems it can solve.
  • We will have Jason Lengstorf from Gatsby on to talk about the project.
  • And much, much more.

Subscribe to Open Waters 

New episodes will be released tri-weekly on Tuesdays.

How Can I Support the Show?

Subscribe, leave a review, and share about us on social media with the hashtag #openwaterspodcast. Have an idea for a topic? Tweet at our hosts Mark Casias, Bob Kepford, and Mario Hernandez. Be sure to subscribe in your favorite podcast platform. Links to follow.

Jun 17 2019
Jun 17

Drupal 8 to Drupal 8

Drupal 9’s release is just around the corner. If you are on Drupal 8, then you are well on your way to Drupal 9 readiness. The planned release date for Drupal 9 is June 2020 with Drupal 8 and Drupal 7 reaching end of life in November 2021. Drupal 8’s new release cycle allows a straightforward upgrade path but developers no longer get the benefit of rearchitecting for the new version. Thinking about architectural decisions, technical debt, and clean site building now will help your Drupal 9 transition and success.

Upgrade to minor releases

The simplest way to prepare for Drupal 9 is by staying up to date on Drupal’s minor release cycle. New features roll out every 6-months and each release adds new functionality plus can deprecate contrib modules (workbench moderation in favor of content moderation, media in favor of core media, panels in favor of layout builder, etc). Drupal 8.7 came out on May 1 while Drupal 8.8 is planned for December 4.

With each minor release, the following should be considered in your deployment process:

Consider soon-to-be-deprecated code

Run `drupal-check` to validate what deprecated code exists in your repository or use the GUI based Upgrade Status module. Create tasks in your backlog to remove these over the following 6-months. Check custom code but also key contrib modules utilized. If deprecations are found in contrib, create an issue then patch the deprecation.

Look ahead to Drupal 9 core

Review the release notes and see what core features can take the place of something you’re using contrib or custom to achieve. Evaluate updating to the core solution. Removing custom code or contrib in favor of core ensures long term support and automated testing. Example: Are you still running contrib media? Work to upgrade this to core media.

Talk to your editors and site builders

Ask them, “What is the one thing we could do or stop doing to make your day to day better?” Work to include this feedback over your next few sprints. Yes, this won’t make your Drupal 9 upgrade easier, but it will ensure team support for Drupal across your organization. Preparing for Drupal 9 includes keeping connected to the overall team’s needs.

Audit Site Building

Drupal’s power lies in how easy it is to add fields, make customizations, and tag on new features — without ever touching code.   

Drupal’s pain lies in how easy it is to add fields, make customizations, and tag on new features — without ever touching code.

Since the core codebase and configuration will not change in Drupal 9, these customizations can add bloat, cause regression risks, and slow performance. 

Regularly check in on your content types, site configuration, and fields to see what can be deprecated, removed, or done in a more reusable way. Things to look for include:

  • Fields added for a one-time event that now sit dormant

    • Think about removing this field completely or utilize an existing block, field, or paragraph to achieve the results.
  • Content types with little to no content added

    • Is this content type still needed? Could you instead create a more generalized content type utilizing paragraphs or layout builder to allow more customization of one-off page creation requests?
  • Out-of-date help text

    • Help text is often forgotten about by power uses. But what happens when a new teammate joins the organization? What about when someone takes a vacation? Ensuring up-to-date help text, consistent field titles, and reasonably organized fields on content types are all ways to support an intuitive admin interface

Automation

In past versions of Drupal, a new major release meant any work to automating processes would grind to a halt as these would need to be recreated for the next major version. Since Drupal 9 will no longer require tearing down and rebuilding your project, any improvement made to automation will give you more time to focus on features, your editors, and your organization’s mission. No stakeholder wants to hear they can’t have a new feature because of the latest security release or a botched release. Give your team confidence to releases and features by automating testing today.

Two aspects of automation should specifically be focused on:

Releases

Every part of a release that can be automated should be. This allows for releases to happen more often with less risk.

  • Aim to create a release process that is not dependent on a single person
    • When a security risk opens up and your release engineer is on vacation, can someone quickly and reliably execute the release?
  • Take one step at a time.
    • Automate one step at a time and improve over time. Don’t try to make everything happen at once.
  • Look at what continuous integration your hosts uses.
    • Leverage something you already have existing through your host or Git provider versus building from scratch.

Testing

Every developer loves squashing technical debt. Every product owner cringes when those two words are mentioned. Technical debt never ends and can take hundreds of hours away from feature development. Though automated testing can’t change that, it can help to prevent rework and regressions as code or features are updated. Similar to automating releases, automating testing provides more confidence in your site’s stability and performance with each test added. 

There are a variety of testing infrastructures to look at but Drupal Core provides PHPUnit tests out of the box and a testing infrastructure for them. Behat integrates well for quick smoke tests after releases to ensure that core pages or links work as expected.

  • Start small.
    • Try to make a simple hello world test and expand to an easy, and somewhat trivial check after a release.
  • Scale up smoke tests.
    • Add in new tests over time for items you check in a smoke test manually after each release. Soon you’ll have your smoke testing fully automated and can start implementing regression tests and testing in all future code.

Plan Strategically for Drupal 9 

Upgrading to Drupal 9 will be an easier process than ever before but will not equal a clean slate to start from. Decisions made today will affect your site for years to come. Throughout your day-to-day, think of the following:

  • Stay up to date on Drupal Minor Upgrades (8.7, 8.8, etc.).
  • Audit your site building to ensure it applies globally, remove one-off fields and deprecated features.
  • Automate your releases and smoke/regression testing.

If you have questions about how to build a strategy for a successful transition to Drupal 9, we’re here to help. Drop us a line.

Jun 14 2019
Jun 14

What’s the one big challenge that marketers and CMO’s we partner with  are facing this year? It’s really tough to put a finger on just one. Proving impact on revenue, marketing team staffing, personalization, and marketing-IT alignment are among the hurdles voiced in discussions that Mediacurrent’s sales team are having with prospects and clients. We are finding CMO’s are pressed more than ever to show marketing’s value while the complexities and opportunities sprouting within digital continue to evolve. Let’s dive into each challenge and uncover what makes these hurdles difficult to jump — and the tools or approach that can help marketers overcome them.

Proving Impact on Revenue

Probably not surprising that last year Gartner surveyed where CMOs were spending marketing budgets. They found marketing budgets shrunk slightly year over year since 2016 while a higher percentage of budgets are being allocated to digital. The pressure is on for marketers to prove how specific marketing campaigns and investments directly contribute to an organization’s revenue. Owners and shareholders want more specificity in understanding how much budget to allocate to higher revenue generating activities. Furthermore, marketers need to react faster to fluctuating market conditions that impact customer experience.

How can you attribute revenue to specific marketing activities and demonstrate ROI so you can invest and optimize in the right activities? There are a number of SaaS tools available and most implement a specific approach to measure marketing attribution and achieve granular ROI tracking. 

  • Motomo - offers a GPL-licensed on-premise web analytics stack.
  • Bizible - analytics and multi-touch revenue attribution.
  • Terminus / Brightfunnel - product suite that offers account-based marketing analytics and sales insights.
  • Conversion Logic - cross-channel attribution with AI-powered insights and budget forecast simulations.
  • Allocadia - a marketing performance management platform that offers revenue attribution and insights into marketing budget allocation.
  • Full Circle Insights - product stack that tracks marketing and sales attribution, built as a native Salesforce App.
  • Google Attribution - formerly called Adometry, it’s now part of the Google Marketing Platform.
  • Salesforce CRM - ROI tracking can be enabled with additional campaign configuration.
  • Domo Digital 360 - full suite of analytics, funnel, and ROI tracking.
  • VisualIQ - strategic measurement, multi-touch attribution, audience analysis, and predictive insights.
  • Oracle Marketing Cloud - integrated suite of tools that include analytics, marketing automation, content/social marketing, and data management.

Because each tool specializes in a specific aspect of ROI tracking, you will need to do some research to understand which tool best fits your organization. Most of the tools listed above implement some form of attribution tracking that will help achieve more robust ROI calculations. Our Director of Marketing Adam Kirby gives a helpful overview of  how marketing attribution works, in his MarTech West slide deck. Organizations we speak with often need help from consultants and agencies to understand how to optimally configure their martech stack with ROI tracking tools. This need coincidentally brings us to the next challenge marketer’s are facing...

Staffing Teams - The Right Blend

Organizations are becoming more careful to find the proper balance between internal team staffing and engaging help from an outside agency. In the early 2010’s, there was a movement within Fortune 2000 companies to bring more expertise in-house. As martech complexity evolved into the latter part of this decade, organizations are realizing that exposure to new technologies and approaches is limited with their in-house teams. By engaging with a wide spectrum of industries, clients, and projects, agencies provide a broad view into the martech landscape that in-house teams don’t have. What’s the right blend? It depends on the vertical. Organizations with one large website typically outsource at least half of their digital marketing. Higher Ed and Government have longer procurement cycles and, consequently, need at least 75% of their overall marketing team to be full-time in-house.

Not only is outside help needed by in-house teams to stay informed, budget scrutiny is forcing CMO’s to seek off-shore development help. However, they are finding off-shore falters when technology projects aren’t being led by one or more on-shore architects who maintain a project’s integrity between on-shore stakeholders and off-shore teams. These technical liaisons are critical to off-shore development success. We see too many organizations assume if off-shore developers demonstrate technical competency, they should be fully capable of leading an implementation. Yet, those organizations fail to consider the strength of influence local culture has on communication dynamics and the perception of requirements by off-shore teams.

Personalization

Another challenge marketers are targeting is how personalization can impact KPIs and produce a higher ROI percentage compared to other digital marketing efforts. In 2017, the concept of personalization was buzzing while marketers were trying to understand what it takes from a content and labor effect to implement. After GDPR went into effect a little over a year ago, personalization efforts have to take into account how GDPR laws impact customer data acquisition and retention, making the implementation of personalization trickier and more complex with respect to data analysis and the ability to capitalize on personalization opportunities. Tools like Acquia Lift, open source marketing automation platform Mautic (recently acquired by Acquia), Triblio, and Optimizely Web Personalization offer slightly different perspectives on personalization. 

When evaluating if you’re ready for personalization, here are eight considerations that will dictate success when carefully planned or potential failure if not addressed:

  1. Do you have enough content that’s written for each persona your personalization effort needs to target?
  2. Do you have content creators who can continually create new and evergreen content?
  3. Do you have KPIs defined to track the performance of your personalization efforts?
  4. Is your martech stack compatible with personalization technologies that fit your business model?
  5. Do accurate, fresh data metrics exist in usable forms? Is data structured uniformly and exclusive of redundancies that might skew its meaning?
  6. How do data privacy laws impact the efficacy of a personalization initiative? Can enough of the right user data legally be captured to supply the initiative?
  7. Are data governance guidelines in place that ensure data integrity stays intact well beyond the implementation phase of a personalization initiative?
  8. Finally, is your department or organization committed to investing time and energy into personalization? It’s a long game and shouldn’t be misinterpreted as an off-the-shelf-set-it-and-forget-it type of content solution.

If you’re starting a personalization strategy from ground zero, Mediacurrent Senior Digital Strategist Danielle Barthelemy wrote a quick guide to creating a content strategy with personalization as the end-goal. Danielle illustrates how a sound personalization strategy positively influences purchase intent, response rate, and acquisition costs. 

Marketing-IT Alignment

In order for digital marketing execution to be as effective and efficient as possible with initiatives like ROI tracking and personalization, it’s imperative for marketing and IT teams to collaborate cohesively.  A frictionless environment is critical for marketers to meet the immediacy of an ever-increasing market speed. In some organizations, these two departments are still maintaining competing interests in relation to policy, security, infrastructure, and budget. Example scenarios include  strict IT policies that can stifle speed-to-market, cowboy marketers all but ignoring technical security when implementing new tools, and executives missing the budgetary discord that echoes when both departments operate in their own silos.

These independent agendas must be meshed together into one for the betterment of the organization. But how? 

  • Learn how to empathize by understanding each other’s goals and challenges across departments. Define a shared list of KPI’s and time-bound each.
  • Schedule weekly touch point meetings between IT and marketing leaders.
  • Conduct a quarterly tools review to understand the “why” behind tools that each department uses.
  • Demonstrate discipline-specific concepts that require collaboration from the other department. For instance, show IT how marketing attribution works and what’s required of them to make it successful. Or, show marketing what a normalized database is and how it will help marketing be successful by reducing duplicate data.

Marketing ROI: An Ongoing Challenge

Overall, the challenges CMO’s are asking us about as we move into the latter half of 2019 are heavily rooted in accurately tracking ROI and putting tools in place to boost it. While marketers have been challenged with proving ROI for years, digital has evolved to a point where tools and systems exist that embolden marketers to aggressively pursue understanding where their money is best spent. For most organizations, there are still talent hurdles to overcome and knowledge gaps to fill to properly implement martech and systems that accurately track ROI. 

How about you — what challenges are your marketing department working to solve this year? Have you found the right in-house to agency team blend? Have you had success with ROI tracking and personalization?

Jun 13 2019
Jun 13

You’ve decided it’s time to rebuild your website. Research has been done, conversion rates have been analyzed, the team has selected a rebuild over a focused fix, and you and your team are committed to making this happen. One of the easiest ways of ensuring your success is to remain mindful of a few key things as you work your way through this larger process.

Regarding that term, “mindful:” one of the Kanopi team’s favorite authors is Brené Brown. She writes, “Mindfulness requires that we not “over-identify” with thoughts and feelings so that we are not caught up and swept away by negativity.” For the purposes of your website rebuild, I’d adapt this to be, “Mindfulness requires that we not “over-focus” on what we’ve done before, and rather remain aware of what’s important for our success so that we can focus on where we want to be.”

So, let’s get to it and break down what the top five things we need to be mindful of when executing a rebuild project.

1. YOU are the difference! Be engaged.

Stakeholder engagement can make or break a rebuild. But rebuilds are time-consuming, and you and your stakeholders will likely be pulled in several directions as you try to execute a rebuild while balancing other priorities and projects.

Your availability, open communication, and timely feedback is critical to enable your team to create the web presence your organization needs to reach its goals. Be realistic in what time your team can devote to the project so you can be as fully engaged as possible. Define roles and responsibilities early as well so it’s clear who is handling what.

If you need an assist from an outside agency to keep the project moving quicker, be direct with them about your business needs and wants. Help them to understand your users and audiences. An agency will make every effort to dive deeply into understanding your market, but at the end of the day, you and your team are the experts on what you do. So view any outside agency as a partner who can work with you towards success, and stay engaged with them throughout the process.

2. Define success & track it

We cannot know if we’re successful until we have identified what success will look like. For some sites, it’s simply exposure. For others, it’s a need to meet specific goals. Take the time to define what your organization needs to achieve, and which key metrics will allow us to quantify success.

Not sure where to start? Here are common metrics should you benchmark now as you prepare for the rebuild:

  • Users: note how many users are regularly coming to your site
  • Bounce Rate: record the overall bounce rate. Make note if this is at, above or below your industry’s standard.
  • Average Session Duration: how long are users staying on your page?
  • Sessions by Channel: where are your users coming from? How much organic traffic is coming in?
  • Top Keywords: identify what words are being used in the search engines when users are finding you. Are these surprising?
  • Competitor Keywords: are users who are looking at your competitors using the same keywords?
  • Top Referrers: who is sending traffic to your site? Maybe social media is key, or you’re more focused on industry referrals. Determine where you should be in the market.
  • Conversion Rates: what forms do you need users to fill out? What conversions are critical to your business goals? These can take the form of contact or forms from your CRM tools such as Marketo or Pardot, or even visits to a specific page or video views.   
  • Accessibility: does your site meet national or international compliance standards?

In short, benchmark where you are now, and use this data to help round out that definition of success. Then come back a few months after launch to reevaluate and compare so you can quantify the success to your stakeholders.

3. Get your content strategy in order

The old saying “Content is King” is truer today than ever. Users are more educated. Search engines have become smarter, looking for more than keywords — they look for meaning in phrases to help determine the focus of a given page.

As one of the most effective methods of growing audience engagement, developing your brand presence, and driving sales, content marketing is a mission-critical growth method for most businesses. — Hubspot

This is where most people turn to me and tell me they’ll get their team on it so they can move further along in the content process. But don’t underestimate the time and energy content development/aggregation can take, even if your larger project is hiring a copywriter to augment your team. All too often, when content becomes a late-stage endeavor a few things happen:

  • timelines get pushed out, waiting for content to be approved.
  • changes to the previous UX are often required to account for unrealized navigation or calls to action, causing potential budget overages.
  • content is rushed and not in alignment with the overall vision.

To help this process come together for your team, here are a few action items to start with:

  • Audit your content: take a full inventory of your site’s content to better identify:
    • what to keep
    • what to repurpose
      • for example: the video may look dated, but could your team could write a blog post from that material?
    • what should not be migrated to your new site
      • this can be archived to be referenced at a later date
  • Build a sitemap: determine the hierarchy of the content on the new site.
  • Identify missing content: comparing your audit to your sitemap, what needs to be produced?
  • Track content creation: track who is responsible for writing, editing and approving content — and give them deadlines
  • Start thinking ahead: you may need to start planning future content. Developing an editorial calendar will help keep the process moving. Content typically included in an editorial calendar:
    • blog posts
    • social media posts
    • videos
    • infographics

When preparing for a rebuild, your content strategy has to be one of the first things your team takes on. This approach will save you time, headaches, and likely budget moving forward. 

4. Consider your users’ digital experience

By this stage in the process you should know your target market, their buying habits and why your product or service is of value to them. You likely have personas and other data to help back this up. But in the omnichannel world in which we thrive, there is often more to architecting an effective user journey. Understanding the nuances of the devices, the influence of how a user comes to your site, and the overall adherence to best practices are complex. For example, consider the following:

  • What percentage of users are coming from mobile devices?
    • Are you CTAs and main conversion points easy to access on a small screen?
    • Is the user journey simplified?
  • Are you users coming from social media?
    • Is it your blog driving traffic or more word of mouth?
    • Is it positive or negative attention?
  • Have you produced a user journey map to identify the different pathways to conversion?
    • Is your site currently set up to promote these journeys?
    • Are you utilizing personalization to customize that user journey?

You can learn more about how to use user research to gain insight into audience behavior to help you frame your thoughts about your personas overall user journey to conversion.

5. Think about the future of your site

Websites need to evolve and adapt as the needs of your users change over time, but as you rebuild, are you setting yourself up for more incremental changes moving forward? Keep in mind that most rebuilds are focused on the MLP or “Minimum Lovable Product.” It’s the simplest iteration of your site that will meet your current needs with the intent to continually improve it over time. Regardless of whether you’re focused on an MLP launch due to either time or budget constraints, we need to keep these future goals in mind as we progress.

And then there’s the technology side of this: whether you’re looking ahead to Drupal 8 or 9 or the next major evolution with WordPress, consider those needs now to help ‘future proof’ your new site. The web changes too quickly to risk your site being stale when it’s still brand new. Talk this through from the start with your team.

These steps will set you up for success.

Your site speaks to who you are as an organization to your target market. Whether you’re a non-profit, higher education or a corporate entity, being mindful now will set your team’s rebuild up for success. And if you need help with your rebuild, contact us. We’d love to partner with you and help you recognize that success.

Jun 13 2019
Jun 13

You’ve decided it’s time to rebuild your website. Research has been done, conversion rates have been analyzed, the team has selected a rebuild over a focused fix, and you and your team are committed to making this happen. One of the easiest ways of ensuring your success is to remain mindful of a few key things as you work your way through this larger process.

Regarding that term, “mindful:” one of the Kanopi team’s favorite authors is Brené Brown. She writes, “Mindfulness requires that we not “over-identify” with thoughts and feelings so that we are not caught up and swept away by negativity.” For the purposes of your website rebuild, I’d adapt this to be, “Mindfulness requires that we not “over-focus” on what we’ve done before, and rather remain aware of what’s important for our success so that we can focus on where we want to be.”

So, let’s get to it and break down what the top five things we need to be mindful of when executing a rebuild project.

1. YOU are the difference! Be engaged.

Stakeholder engagement can make or break a rebuild. But rebuilds are time-consuming, and you and your stakeholders will likely be pulled in several directions as you try to execute a rebuild while balancing other priorities and projects.

Your availability, open communication, and timely feedback is critical to enable your team to create the web presence your organization needs to reach its goals. Be realistic in what time your team can devote to the project so you can be as fully engaged as possible. Define roles and responsibilities early as well so it’s clear who is handling what.

If you need an assist from an outside agency to keep the project moving quicker, be direct with them about your business needs and wants. Help them to understand your users and audiences. An agency will make every effort to dive deeply into understanding your market, but at the end of the day, you and your team are the experts on what you do. So view any outside agency as a partner who can work with you towards success, and stay engaged with them throughout the process.

2. Define success & track it

We cannot know if we’re successful until we have identified what success will look like. For some sites, it’s simply exposure. For others, it’s a need to meet specific goals. Take the time to define what your organization needs to achieve, and which key metrics will allow us to quantify success.

Not sure where to start? Here are common metrics should you benchmark now as you prepare for the rebuild:

  • Users: note how many users are regularly coming to your site
  • Bounce Rate: record the overall bounce rate. Make note if this is at, above or below your industry’s standard.
  • Average Session Duration: how long are users staying on your page?
  • Sessions by Channel: where are your users coming from? How much organic traffic is coming in?
  • Top Keywords: identify what words are being used in the search engines when users are finding you. Are these surprising?
  • Competitor Keywords: are users who are looking at your competitors using the same keywords?
  • Top Referrers: who is sending traffic to your site? Maybe social media is key, or you’re more focused on industry referrals. Determine where you should be in the market.
  • Conversion Rates: what forms do you need users to fill out? What conversions are critical to your business goals? These can take the form of contact or forms from your CRM tools such as Marketo or Pardot, or even visits to a specific page or video views.   
  • Accessibility: does your site meet national or international compliance standards?

In short, benchmark where you are now, and use this data to help round out that definition of success. Then come back a few months after launch to reevaluate and compare so you can quantify the success to your stakeholders.

3. Get your content strategy in order

The old saying “Content is King” is truer today than ever. Users are more educated. Search engines have become smarter, looking for more than keywords — they look for meaning in phrases to help determine the focus of a given page.

As one of the most effective methods of growing audience engagement, developing your brand presence, and driving sales, content marketing is a mission-critical growth method for most businesses. — Hubspot

This is where most people turn to me and tell me they’ll get their team on it so they can move further along in the content process. But don’t underestimate the time and energy content development/aggregation can take, even if your larger project is hiring a copywriter to augment your team. All too often, when content becomes a late-stage endeavor a few things happen:

  • timelines get pushed out, waiting for content to be approved.
  • changes to the previous UX are often required to account for unrealized navigation or calls to action, causing potential budget overages.
  • content is rushed and not in alignment with the overall vision.

To help this process come together for your team, here are a few action items to start with:

  • Audit your content: take a full inventory of your site’s content to better identify:
    • what to keep
    • what to repurpose
      • for example: the video may look dated, but could your team could write a blog post from that material?
    • what should not be migrated to your new site
      • this can be archived to be referenced at a later date
  • Build a sitemap: determine the hierarchy of the content on the new site.
  • Identify missing content: comparing your audit to your sitemap, what needs to be produced?
  • Track content creation: track who is responsible for writing, editing and approving content — and give them deadlines
  • Start thinking ahead: you may need to start planning future content. Developing an editorial calendar will help keep the process moving. Content typically included in an editorial calendar:
    • blog posts
    • social media posts
    • videos
    • infographics

When preparing for a rebuild, your content strategy has to be one of the first things your team takes on. This approach will save you time, headaches, and likely budget moving forward. 

4. Consider your users’ digital experience

By this stage in the process you should know your target market, their buying habits and why your product or service is of value to them. You likely have personas and other data to help back this up. But in the omnichannel world in which we thrive, there is often more to architecting an effective user journey. Understanding the nuances of the devices, the influence of how a user comes to your site, and the overall adherence to best practices are complex. For example, consider the following:

  • What percentage of users are coming from mobile devices?
    • Are you CTAs and main conversion points easy to access on a small screen?
    • Is the user journey simplified?
  • Are you users coming from social media?
    • Is it your blog driving traffic or more word of mouth?
    • Is it positive or negative attention?
  • Have you produced a user journey map to identify the different pathways to conversion?
    • Is your site currently set up to promote these journeys?
    • Are you utilizing personalization to customize that user journey?

You can learn more about how to use user research to gain insight into audience behavior to help you frame your thoughts about your personas overall user journey to conversion.

5. Think about the future of your site

Websites need to evolve and adapt as the needs of your users change over time, but as you rebuild, are you setting yourself up for more incremental changes moving forward? Keep in mind that most rebuilds are focused on the MLP or “Minimum Lovable Product.” It’s the simplest iteration of your site that will meet your current needs with the intent to continually improve it over time. Regardless of whether you’re focused on an MLP launch due to either time or budget constraints, we need to keep these future goals in mind as we progress.

And then there’s the technology side of this: whether you’re looking ahead to Drupal 8 or 9 or the next major evolution with WordPress, consider those needs now to help ‘future proof’ your new site. The web changes too quickly to risk your site being stale when it’s still brand new. Talk this through from the start with your team.

These steps will set you up for success.

Your site speaks to who you are as an organization to your target market. Whether you’re a non-profit, higher education or a corporate entity, being mindful now will set your team’s rebuild up for success. And if you need help with your rebuild, contact us. We’d love to partner with you and help you recognize that success.

Jun 13 2019
Jun 13

In a world where there is no limit to devices to access information, you must ensure your data is always available on the go! The pace of innovation in content management is accelerating along with the number of channels to support the web content.

A content marketer’s work is not done by just creating the content for the website. Making it available across devices and managing content channel hubs and making it user-friendly, most importantly.

But first, let’s understand how the content presentation has changed over the years.

The Traditional Approach: Coupled Architecture

CMS like Drupal are traditionally monolithic, wherein they own the entire technological stack, both backend (data layer) and frontend (presentation layer). The benefit – it allowed easy site management with admin user being able to write and publish on the same system.

monolithic-architecture-srijan-technologies

Monolithic architecture is part of one cohesive unit of code where components work together with                          the same memory space and resources

Content editors have preferred the traditional approach because of its clear and logical modular architecture which allowed them to control in-place editing and layout management.

tightlycoupled-srijan

They Broke Up! What?

Even though the coupled architecture was easy to develop, deploy, and test, decoupled application architecture has become popular lately owing to the break-through user experiences it provides.

Decoupling segregates the concerns of frontend and backend of an application by simply adding a layer of technical abstraction (API).

One for content creation and storage, and the other as the presenting layer. In this scenario, a CMS like Drupal serves the backend as a data repository and a third party application like React JS owns the frontend providing interactive UIs.

In the video, watch how Drupal backend interacts with the decoupled apps in the decoupled approach and how it’s different from the traditional approach.

 

 

A decoupled architecture splits the content of a website from how it is displayed on multiple independent systems to how it is created.

Fully Decoupled or Headless Architecture

Headless architecture is similar to decoupled architecture in a way that both have content management and storage backends and deliver content from that database through a web service or API.

The only difference between the two is headless Drupal does not have a defined front-end system and has no functionality to present content to an end user on its own. The API, which exposes information for consumption, connects through an array of application.

headless-drupal-application-srijan

Srijan has implemented the headless approach for its various clients with much ease within the given stipulated time frame. Srijan helped Estee Lauder reduce its training session cost by up to 30% with a decoupled and multilingual LMS.

Understand your situation. Who is it for?

Here are some key pointers that will help you figure out if fully decoupled approach is an option for your project:

  • Not for basic editorial websites

Decoupling will do no good to a standalone website with basic editorial capabilities such as a blogging site. Such websites require less or no user interactivity and further, it can also hamper the performance of the crucial features required by content editors like the content preview, layout management, in-line editing making a simple website rather complicated.

  • Not if you want to lose more functionalities

One of the major advantages of CMS like Drupal is, you can access the plethora of modules in just one click. By simply selecting the Simple Google Maps module from your admin toolbar, you can have it on your website.

However, implementing decoupled architecture takes away such easy-to-use features since the CMS no longer manages the frontend.

  • Not if you want a complex procedure

If your design goals are closely aligned with traditional coupled architecture, then implementing decoupled approach will complicate the process and will add to the extra cost of creating those features from scratch.

Take a look here to know in which use cases decoupled Drupal works best and how to decide whether you need the architecture for your next project or not.

Enter Progressive Decoupling: A Hybrid Approach

Progressive decoupling gives you the best of both worlds. It allows Drupal to leverage JavaScript frameworks (like React and Angular) for dynamic user experience by injecting JS only where it’s needed in the front-end.

The approach is in the best interest of both - editors and developers as it strikes a balance between editorial and developer needs.

Which means the editor can control the layout of the page and the developer can use more JavaScript by interpolating a JavaScript framework into the Drupal frontend.

The video attached below will help you better understand the concept.

Comparison Chart: Coupled, Progressive or Fully Decoupled

This comparison chart will help you understand the features.

Features Coupled Decoupled (Progressive) Fully Decoupled/Headless Architecture Tightly Coupled Loosely coupled Separated Performance Fast Fast Fastest Fixed presentation environment Yes Yes No Use cases Complete text-based sites involving no user interactivity Websites that require rich/interactive elements of user experience Websites that require rich/interactive user experience Layout style Overrides built-in themes and templates Easy and secure third-party integrations Easy and secure third-party integrations Integration No Future-proof Future-proof SEO friendly Most SEO friendly SEO friendly Non-SEO friendly Delivery channels Limited Limited Unlimited API usability No APIs Based on architecture Complete API based Preview availability Available Available Unavailable

What’s in Store for the Future of Decoupling

With enterprises choosing to opt for a more flexible and scalable experience, the gap between the developers and content editors needs to be reduced.

The rapid evolution in decoupling allows constructing a content model once, preview it on every channel, and use familiar tools to either edit or place content on any channel in question, and decrease the delivery time.

At Srijan, we believe in a mature agile engineering process delivering better results. Contact us to get started.

Jun 11 2019
Jun 11

Every once in a while you have those special pages that require a little extra something. Some special functionality, just for that page. It could be custom styling for a marketing landing page, or a third party form integration using JavaScript. Whatever the use case, you need to somehow sustainably manage JavaScript or CSS for those pages.

Our client has some of these special pages. These are pages that live outside of the standard workflow and component library and require their own JS and CSS to pull them together.  Content authors want to be able to manage these bits of JavaScript and CSS on a page-by-page basis. Ideally, these pages would go through the standard development and QA workflow before code makes it out to production. Or perhaps you need to work in the opposite direction, giving the content team the ability to create in Production, but then capture and pull them back into the development pipeline in future deployments?

This is where Drupal 8’s Configuration Entities become interesting. To tackle this problem, we created a custom config entity to capture these code “snippets”. This entity gives you the ability to enter JavaScript or CSS into a text area or to paste in the URL to an externally hosted resource. It then gives you a few choices on how to handle the resulting Snippet. Is this JavaScript, or CSS? Do you want to scope the JavaScript to the Footer or the Header? Should we wrap the JavaScript in a Drupal Behavior?

Once the developer makes her selections and hits submit, the system looks at the submitted configuration and if it’s not an external resource, it writes a file to the filesystem of the Drupal site.

Now that you’ve created your library of Snippets, you can then make use of them on your content. From either your Content Type, Paragraph, or other Content Entity – simply create a new reference field. Choose “Other”, then on the next page scroll through the entity type list till you get to the configuration section and select JSnippet. Your content creators will then have access to the Snippets when creating content.

By providing our own custom Field Formatter for Entity Reference fields, we’re then able to alter how that snippet is rendered on the final page. During the rendering process, when the Snippet reference field is rendered, the custom field formatter loads the referenced configuration entity and uses its data and our dynamically generated library info to attach the relevant JavaScript or CSS library to the render array. During final rendering, this will result in the JavaScript or CSS library being added to the page, within its proper scope.

Because these snippets are configuration entities, they can be captured and exported with the site’s configuration. This allows them to be versioned and deployed through your standard deployment process. When the deployed configuration is integrated, the library is built up and any JS or CSS is written to the file system.

Want to try it out? Head on over to Drupal.org and download the JSnippet module. If you have any questions or run into any issues just let us know in the issue queue.

Jun 11 2019
Jun 11

Virtual. Remote. Distributed. Pick your label. This style of organization is becoming wildly more in demand and popular among many agencies and organizations. It saves the cost of office space, allows for hiring the best talent possible regardless of location, can be a huge bonus to employees who require flexibility in their schedules, and saves everyone time in commuting assuming they don’t go to a shared work space. You can even wear what you want (being mindful of video chats, of course).

The flipside? While many folks have gone remote, some people find the experience quite isolating and disconnected. Does remote work make people happier? Does it make them more productive? From my experience running a remote-only agency, the answer is not really. Going for days not seeing another human in person can be extremely isolating and demotivating. And while it seems as though you’d have more time at your computer, and therefore would be more productive, often the opposite is true: it can often be harder to have focused time to work on tasks if you are at home with multiple screens. And even worse if you are distracted by anything at home (deliveries at your door, that laundry in the corner, etc).

It can also be physically damaging: the human body is not designed to sit at a desk for long periods of time, and there’s less incentive to get up and move if you don’t have to move more than a few feet to your computer.

I know I’ve experienced all those issues. So I feel everyone’s pain. Literally.

The main reason Kanopi Studios exists is to support humans in every way.

We support our clients by giving them great work so they can be successful online, but additionally Kanopi serves to support its employees so they are successful in both their work and home lives. We want our people to always be happy, fulfilled, and constantly evolving in a positive way. So it’s critical that we create an environment and culture that fosters practices that provide meaning, collaboration, and happiness regardless of location. It’s also critical that employees feel empowered to speak up if they are feeling the negative repercussions of remote work.

As CEO, it’s my job to give my staff the right tools and systems so that they are as happy and healthy as possible, and to create connectivity in Kanopi’s culture. Building and sustaining strong relationships requires a unique approach that makes use of a variety of tools to create the right work culture to combat the isolation.

There’s a session I give on this very topic, and the DrupalCon video is linked below. I cover how to be the best remote employee, as well as how to support your team if you are a leader of a remote team. I give key tactics to keep you (and all other staff) inspired, creative, productive and most importantly, happy! I hope you find it helpful in making your own work environment as connected and collaborative as possible, no matter where you are.

[embedded content]
Jun 06 2019
Jun 06

Enterprises can find their websites attracting visitors and clients from different geographies, speaking different languages. The market is so huge (and international) that targeting only English speaker based users means deliberately missing out on an effective way to grow audience, ROI, customer trust, and rank on Google.

Language can be an enormous barrier, or an effective tool.

With an intent to create a great digital experience, enterprises often find themselves in a tough spot having to use and experiment with tools wrapped in an unfamiliar language.

Only it doesn’t have to be so.

In order to take advantage of the international and multilingual market with your Drupal 8 website, you need to make sure you have set your SEO just right (along with the language, of course).

But is it really that easy?

Why Opt for a Multilingual Website?

The world wide web makes it easy for the online businesses to be looked around from across any part of the world. While, the right SEO strategy will give you a place on the first page of Google, making it exclusive to one language is actually not a good idea (even for your SERP).

Smart marketers don't keep all eggs in one basket because it is bad for business. So is keeping all content in one language.


Here’s why a multilingual website will help:

Increases Your Possible Customer Base

Contrary to the common belief, not many people speak or use English outside certain geography.

Interestingly, the statistics collected by Internet World Stats reflect why your content shouldn’t solely be in English. While it dominates the scenario, English represents only 25% for internet searches.

horizontal graph with ten blue bars on a white background
source: Statista

Not a small number, however, English’s relative share of cyberspace has shrunk to around 30%, while French, German, Spanish and Chinese have all pushed into the top 10 languages online since 2008.

Language profoundly affects the user experience on the internet. In a pan-EU survey (2011) 44% of respondents feel they are missing interesting information because web pages are not in a language that they understand.

Availability of content in different languages can also affect the user’s understanding and succeeding action.

In an interesting case study of the Tel Aviv, Israel, searching for “restaurant” locally in Hebrew, Arabic and English brought back different results for each language. 

three blocks with a map image and text written on top

Gets Loyal Customers

According to Gartner, 89% of companies expect to compete mostly on the basis of customer experience. And language is the secret trailblazer.

“The web doesn’t just connect machines it connects people”


Native language helps companies connect, forge more trust and increase customer satisfaction. In fact, 74% of consumers are more likely to repurchase if after-sales care is offered in their native language.

In fact, there is an undeniably strong link between in-language content and a consumer’s likelihood of making a purchase.

Improves Your SERP

Search engines value quality content and user engagement. By providing your website in different languages, traffic coming from either version will improve the search engine ranking for the whole site, given you are using the right hreflang tags.

It also helps search engines understand your site, as it’s clear which languages you’re providing the content in.

Google doesn’t view the content in different languages as a duplicate, because it has multiple version of itself too.

Drupal 8 Multilingual Initiative

The multilingual initiative (started with D8) aimed to rebuild language support from the ground up so that everything in Drupal understood the language from the start.

Drupal 8 offers much more out of the box for building multilingual sites. More powerful than Drupal 7, it has greater flexibility, all without the need for any contrib module.

Providing content translation in an additional 94 languages, the number of modules have reduced from 22 (as in Drupal 7) to 4.

  1. Language: This is the base module needed to allow Drupal to add and choose the language of choice. Natively, it is available in 94 languages.
  2. Locale (Interface Translation): It helps to translate the interface, from both core and contributed modules and themes. It also provides built-in translation UI for easier editing.
  3. Content Translation: This module translates all the content types and content entities including site content, pages, taxonomy terms, blocks, etc., possible with its inbuilt API. Providing the language selector, you can choose your preferred language by selecting the checkbox.
  4. Configuration Translation: Allows you to translate configuration interface, such as of field labels, views, field settings, blocks, panels, etc. It also has a built-in responsive translation interface.

“Drupal 8 is easy and efficient for multilingual businesses.”


Other than the core modules, developers can also take hreflang into consideration. While the core Content Translation module adds hreflang tags only to translated entity pages hreflang module, on the other hand, adds hreflang tags to all pages.

An example of a Drupal 8 multilingual website: 

 Drupal-North-en-Srijan

The Drupal North Website in English

Drupal-North-fr-Srijan

The Drupal North Website in French

Drupal Multilingual SEO Challenges

Multilingual SEO can be intimidating. In fact, it is the elephant in the room, if not addressed, can potentially deflect your overall SEO efforts.

Language and cultural differences, website architecture, content duplicacy are amongst some of the challenges. Understanding these challenges can help marketers come up with better strategies to tackle the problem.

Here’re some of the multilingual SEO challenges and how Drupal helps you fight them off.

Multilingual and Multi-Geo are Different


A multilingual site must not be confused with multi-regional website. A multilingual site can create a ripple effect in the sense that a mistake in the original site will be replicated in all the duplicate sites.

A multilingual website is any website that offers content in more than one language. For example, a Canadian business with English and French versions of its site. Google Search tries to find pages that match the language of the searcher.

A multi-regional website is one that explicitly targets users in different countries. For example, a product manufacturer that ships to both Canada and the United States. Google Search tries to find the right locale page for the searcher.

Some sites are both multi-regional and multilingual: for example, a site might have different versions for the USA and for Canada, and both French and English versions of the Canadian content.


  • Site Structure, Navigation and Menu

    Navigation isn’t just for the viewers. If the navigation structure prevents visitors from easily finding the information it might also be blocking the search engines from indexing the content.

    It’s difficult to determine geo-targeting on a page-by-page basis, so it makes sense to consider using a URL structure that makes it easy to segment parts of the website for geotargeting.

    In Drupal, Entity translation solves the issues related to site structure, navigation and menu by default.

    Each variant has a language assigned and is called an entity translation. It allows (fieldable) entities to be translated into different languages, by introducing entity/field translation.

    It synchronizes taxonomy and fields across translations of the same content. Translation fallback for menus is not configurable by default

  • Content revision and publication workflow

    Content revisioning, proofreading, and approval are part of the critical content editing process.

    The Workflow module allows to create arbitrary Workflows, and assign them to Entities. Transitions between states can be allowed as per the role. For example, a workflow with states of Draft, Review, and Published could be assigned to the story node type. Only users with the role of 'chief editor' can set Stories to the published state.

    You can set up the Workflow to alter states from form, page, comment, a special block, and workflow tab.

    However, the module follows a linear approach. It would need revision if it is not one way.

    Another module, the Workbench moderation suite is modular, allowing site builders to build the workflow that best suits the content administrators on their site. The Workbench suite provides authors, editors, and publishers with a unified interface for managing content relevant to them.

  • User permission and role for different editorial teamsSince a number of users (read editors) are involved with the content editing a multilingual website, chances of accidents on the website are high. Editors can be clubbed together with set access limits.

    The Group module allows you to create arbitrary collections of your content and users on your site and grant access control permissions on those collections.

    All of the functionality this module has to offer is based on custom entities, opening up the door to various extensions or alterations that the user sees fit. The relationship between a group and its content or users is also an entity, allowing you to easily add metadata to that relationship.

  • Dealing with Duplicate content

    Drupal 8 provides schema out of the box. It is semantic markup text that provides search engines with a basic blueprint to categorically divide and simplify the information by breaking it into simpler blocks for easy description and discovery.

    Schema, in multilingual and multiregional SEO provides each and every language content with same content id letting the search engine know that variations of same content, thus, cancelling out the content duplicacy issues.

    While this feature was part of Drupal 7, it was in the form of separate entity translation plugin, which wasn’t part of the core.

    The main challenge, however, remains how to concatenate content so search engines don’t think it’s duplicate.

    This can be solved with the Entity Translation module which allows entities (such as nodes) to be translated into different languages. It provides field-level translation, so that site builders can select which fields should be translatable. It provides a UI for users to translate these fields into other languages.

  • Path alias

    As a foundational element of the global SEO, URLs need to be determined your multilingual URL structure strategy early on in the process.

    While pathauto module automatically generates URL/path aliases for various kinds of content (nodes, taxonomy terms, users) without requiring the user to manually specify the path alias.

    By default, Drupal doesn’t allow the same URL over translated pages. It can be done by applying the patch and it will run.

  • Content Relevance Building unique vocabularyit is vital that you get the translations right. Seldom content relevance can get lost during translation, like the adventure in mistranslation costed HSBC $10 million for rebranding.  

    While the above instance is hilarious, it can be avoided for your digital property. You can build your custom vocabulary with Taxonomy. It is a core module in Drupal 8 and gives your sites use of the organizational keywords known in other systems as categories, tags, or metadata. It allows you to connect, relate and classify your website’s content. In Drupal, these terms are gathered within "vocabularies".

    The Taxonomy module allows you to create, manage and apply those vocabularies. translation module allows translation of taxonomy vocabularies and terms. 

funny-translationExito in Spanish means success, not exit

A word of caution, translate only when the logic prevails. Use separate vocabularies, translated vs untranslated, for different languages to begin with.

Building Multilingual LMS for Estee Lauder

Estee Lauder is a global leader in prestige beauty — delighting its consumers with its transformative products and experiences. It takes pride in focusing solely on prestige makeup and beauty care with a diverse portfolio of 25+ brands distributed globally through eCommerce channels and retail outlets sold in 150 countries. 

We built an open-source, multilingual, decoupled learning platform where beauty advisors could consume a vast set of learning resources.

The Multilingual Challenge

To ensure an effective product training and delivering the information fast knowledge exchange needs to be user-friendly, structured, and in their own language. With more than -- languages, the LMS needed to provide complete translation of the entire system.

The lack of direct connection between the LMS user and the language demanded that each language be provided for different geography.  

Discover the La Mer Connection LEVELS CONTENT CHS La Mer Learning Experience

A video quiz in Japanese

learning level content La Mer Learning ExperienceA video quiz in English

When designing the solution, we created a relation between market and language, and this worked as a bridge between available language for user selection. With a language and market segmentation/ filter, we could now access information about user activity based on their preference. 

We also helped Estee Lauder reduce 30% cost in classroom training and provided them with solution to track ROI from the learning and training initiatives.

Other Drupal Modules You Can Use

  • SEO Checklist: It uses best practices to check your website for proper search engine optimization. It eliminates guesswork by creating a functional to-do list of modules and tasks that remain. 
  • Real-time for SEO: This module helps you optimize content around keywords in a fast, natural, non-spam way.
  • Taxonomy title: It update the heading tag at the top of the taxonomy term page
  • Menu Attributes: It allows you to specify some additional attributes for menu items such as id, name, class, style, and rel.
  • Search 404:  For pages that do not exist (404), it performs a search based on the keywords in the URL, and shows the relevant result instead of the 404 page. It also includes search engine keywords detections as well as regular expression based term filtering from the URL.
Best Multilingual Practices to Consider from Google 

  • Use different URLs for different language versions
  • Make sure the page language is obvious
  • Let the user switch the page language
  • Use language-specific URLs
  • Targeting site content to a specific country (geo-targeting)
  • Using locale-specific URLs (.in for India)

Conclusion

Multilingual SEO is one of the most complicated and ignored fragments of web marketing. The good news is that it’s easier than ever to provide broader language support. With their adroit skills, our experts save you from the stress and build the best and provide you with innovative multilingual services.

Contact us today, if you are looking to build or modernize your multilingual website without losing the SEO prowess. Drop a mail at [email protected].

Jun 06 2019
Jun 06

“Can I use Drupal for project management?” Definitely. 

Given all its content-oriented baked-in capabilities — file management, version control, easy content creation, and editing — Drupal makes the perfect software for:
 

  • managing your projects the easy and the... smart way
  • streamlining communication among your team members and with your contractors
     

In this respect, Drupal provides its own feature-rich distributions to help you put together your robust setup in no time. “Distributions” that come already packed with a set of useful sub-modules and themes, that all support the core functionality: project management (and smooth collaboration).

And without further ado, here the 2 most popular Drupal distributions for project management and team collaboration for you to evaluate first: RedHen and Open Atrium.
 

Loaded with robust and modern features, this Drupal-native CRM is designed with flexibility in mind. Meaning that it integrates seamlessly with the enterprise solution that you're using (Blackboud, Salesforce) and it supports a wide range of use cases...

And speaking of its functionalities:
 

  • engagement tracking and monitoring
  • data mangement: information about your contacts, the relationships among them and with your own company (e.g. memberships)
  • event registration integration
  • one-page donation forms to custom-tune to your liking
     

As for those many use cases that this Drupal distribution's built to accommodate, let's pick just a few real-world examples:

  • It's the best choice if smoothly integrating your CRM with your other enterprise solutions is critical for you
     
  • It streamlines tracking interactions with your contacts and organizations. Furthermore, since you can easily integrate it with your website, you get to leverage the provided data in order to adjutst the user experience accordingly...
     
  • It allows you to customize it and thus to give it a Drupal-like look and feel: to integrate it with modules like Rules or Views, to go for the same field creation UI etc.
     
  • Is your contacts list a huge one? This CRM comes to your rescue with some powerful baked-in tools: an efficient find-and-dedupe interface, an automated filter built in the UI, that you can use to filter your contacts by specific fields etc.
     
  • It automatically syncronizes data in your Contacts list with any newly updated data on your Drupal Users list
     


In short: RedHen CRM makes one of the top choices when you consider using Drupal for project management purposes. It's a lightwright, self-contained framework, more of a “cluster” of multiple specialized modules:
 

  • Organization
  • Activity
  • Fields
  • Organization Group
  • Dedupe
  • Registration
  • and a few more...
     

Looking for a Drupal-native distribution built around the team collaboration functionality?

One that should be:
 

  • convenientyly extensible
  • “loaded” with robust collaboration and information sharing features?
     

Then Open Atrium fits the profile in the slightest detail.

Built on top of the Organic Groups and Panopoly modules, it's a framewrok flexible enough to support discussion configurations by key criteria like team, project, organization...

And here are some more powerful features worth considering when you're still thinking whether you should use Drupal for project management:
 

  • an access control system, that grants granular control to certain sections of your project
  • a drag and drop layout with plenty of widgets to select from for customizing your landing pages and dashboard
  • file storing and sharing features
  • built-in Events, Files, Discussions, Issue Tracking, Document Wiki
  • an easy to customise, responsive theme
     

The END!

These are but 2 viable answers to your “Can I use Drupal for project management and team collaboration?” type of question. 2 of the options available that best meet some of your main requirements when looking for a project management software:
 

  • to be easy to use
  • to ship with an entire collection of file management and communication features
  • to be flexible enough and allow quick customization and seamless integrations
     

Have you tried other Drupal modules/distributions built around this functionality so far? 

Image by jessica45 from Pixabay

Jun 05 2019
Jun 05

On Twitter, in Slack, on Discord, in IRC, or wherever you hang out with other developers on the internet, you may have heard some formulation of the following statements:

  • React doesn't support accessibility
  • React makes websites inaccessible
  • People should write accessible HTML instead of React
  • React is ruining the internet

There's a somewhat common misperception that JavaScript frameworks and web accessibility don't mix. React, being one of the largest JavaScript libraries, is often the target. 

In my career, however, I have had the interesting experience of being introduced to accessibility and ReactJS at around the same time. I found tooling in React that helped me learn a lot about accessibility that I never would have encountered otherwise.

And while I don't disagree that there are plenty of libraries, websites, apps, etc. written in React that are inaccessible, I do disagree there is something inherent in ReactJS that makes developers build inaccessible sites. In fact, I love the accessibility tooling available in the React ecosystem, so this post is really about how React can help you make more accessible websites than you've ever made before.

I'll outline how you can combine React linting tools, DOM auditing, and Storybook (a component library tool) to provide a really supportive accessibility environment for developers -- whether they are accessibility pros or just getting started. By the end of this post, you'll have the following configured for your Gatsby project (or other React project):

  • in-editor reporting of accessibility errors
  • a pre-commit hook for preventing accessibility errors from getting into the repository
  • browser console reporting of accessibility errors during development, with links to info on how to resolve the errors
  • a component library with built-in accessibility testing so all project stakeholders can hold the team accountable for accessibility issues

Want to get started right away? I created a Gatsby starter with all these accessibility tools built in. Checkout the gatsby-starter-accessibility repo that has all these features available out of the box.

Tools and Setup

eslint-plugin-jsx-a11y

If you've written JavaScript over the past few years, you've probably used or at least heard of ESLint. If not, now is a great time to get started with it!

ESLint is a linting utility for JavaScript that helps you catch formatting and syntax errors while you are writing code. Most editors have some sort of linting configuration built in, which lets you see errors in your editor while you code.

This is really helpful for keeping code consistent, especially when there's a lot of people working on a project.

ESLint also has a really healthy plugin ecosystem. You can include rules specific to the JavaScript framework you are working with (i.e., React, Angular, Vue, etc), among others. For React, I typically use the eslint-plugin-react and the really helpful eslint-plugin-jsx-a11y. This plugin lints your code for known accessibility violations, using these rules.

Having these automated tests run while you are writing code can prevent so many errors. Even though automated accessibility testing catches only about 20-30% of all accessibility errors, catching these errors before they make it into a codebase can save time, budget, and energy for doing more manual testing once the code is in the browser.

Usage

Here's how you can get started with accessibility linting in your React project.

First, we'll need to install the necessary eslint packages:

npm install eslint eslint-plugin-react eslint-plugin-jsx-a11y --save-dev

In your package.json, add the following configuration:

"eslintConfig": {
    "parserOptions": {
      "sourceType": "module"
    },
    "env": {
      "node": true,
      "browser": true,
      "es6": true
    },
    "plugins": [
      "react",
      "jsx-a11y"
    ],
    "extends": [
      "eslint:recommended",
      "plugin:react/recommended",
      "plugin:jsx-a11y/recommended"
    ]
}

With this added to your package.json, ESLint will use the rules recommended by ESLint, React, and the jsx-a11y plugin while you are working. 

You'll want to make sure your editor is set up to display linting errors in the editor for this to be really useful.

Add a pre-commit hook for preventing inaccessible code in the codebase using lint:staged

Now we've got some accessibility linting set up, and hopefully everyone working on the project has linting turned on in their editor so they can see any errors while they work.

But you can't be 100% sure that everyone will be paying attention to the linter. And even if they are, it's easy to make a quick change, switch files, and any errors will be out of sight, out of mind.

What we can do as an extra check to prevent inaccessible code from entering the codebase is to add a pre-commit hook that runs the linting we set up above every time a developer tries to commit code. If an accessibility error is found, an error message will display with the relevant linting error and location of the error, and the commit will be prevented until the developer resolves the issue.

lint-staged will run a pre-commit hook that will catch any accessibility errors raised by eslint-plugin-jsx-a11y

lint-staged will run a pre-commit hook that will catch any accessibility errors raised by eslint-plugin-jsx-a11y

Usage

The easiest way to set up pre-commit linting hooks is using the lint-staged package. After you've got all your eslint configuration set up (from our first step), run the following command in your project directory:

npx mrm lint-staged

This command will install the husky package for managing the pre-commit hooks and look in your package.json to automatically setup a pre-commit hook based on your linting configuration.

A simple configuration that lints all JS files based on the existing eslint configuration in the repo will look like this (from package.json):

"husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
},
"lint-staged": {
    "*.js": [
      "eslint"
    ]
}

You can adjust this as you see fit. For example, sometimes you want to limit linting to certain directories. To run the pre-commit hook only on JS files in the src directory, you would update the lint-staged configuration like this:

"lint-staged": {
    "src/*.js": [
      "eslint"
    ]
}

The great thing about lint-staged is that it only lints the files that are part of the current commit. If for some reason there is some pre-existing errors in another part of the codebase, the commit won't be prevented--it only prevents new errors from being introduced.

react-axe

The great thing about the linting setup we have now is that it will prevent a lot of errors from being introduced into the codebase. It won't prevent all errors, however. Some errors only exist when several components are used together, or from certain content, and can only be caught in the browser.

Luckily, we have a solution for this, too. Axe is an open source engine for automated accessibility testing, supported by Deque. I first became familiar with axe by using their really useful browser extension for testing individual pages in the browser.

The problem with browser-extension accessibility testing is that they are typically only run after development is complete. Using the react-axe library, you can have automated accessibility testing run on every page during development, so developers can get real-time feedback on accessibility issues. This helps make sure that accessibility issues never make it to production, and it also educates developers who may not be accessibility experts on potential pitfalls.

The react-axe library is an easy to use implementation of the axe engine, specifically for React.

Usage

Here's how to get started using react-axe with Gatsby (someone made a Gatsby plugin for it!):

npm install --save gatsby-plugin-react-axe

Add gatsby-plugin-react-axe to your plugins array in gatsby-config.js

module.exports = {
 siteMetadata: {
        title: 'Gatsby Default Starter',
    description:
      'Kick off your next, great Gatsby project with this default starter. This barebones starter ships with the main Gatsby configuration files you might need.',
    author: '@gatsbyjs',
  },
  plugins: [
    'gatsby-plugin-react-axe',
    // other plugins go here
  ],
};

Now, when the page renders, the plugin will print any accessibility errors to the browser console. Here's an example, where I've put an <h5> directly underneath an <h1>:

React aXe will show accessibility errors in the console while you are developing.

React aXe will show accessibility errors in the console while you are developing.

You can see that in the axe message in the console that it has identified my heading issue: "Heading issues should only increase by one" as a moderate issue. It also includes a link to learn more about why this is an issue and how to resolve it: https://dequeuniversity.com/rules/axe/3.2/heading-order. And lastly, it displays the specific element that is causing the issue for easy identification.

This kind of instant feedback is so important, whether you are an accessibility beginner or even a seasoned pro. Catching the automated issues instantaneously can give you more bandwidth to focus on other more involved tasks.

Storybook and Accessibility

The last piece of our accessibility workflow has to do with our component-driven workflow. For React projects, I have really enjoyed using Storybook to build and document our front end components. 

Storybook is an open source tool for developing UI components in isolation for React, Vue, and Angular. It makes building stunning UIs organized and efficient.

storybook.js.org

Besides having a nice workflow and UI, Storybook has an awesome accessibility add-on that adds a panel to each component in your component library highlighting accessibility issues.

Our storybook configuration has built-in axe tests for each component and a color blindness simulator, provided by the storybook accessibility add-on.

Behind the scenes, the add-on actually also uses aXe for testing. This is really nice, because it means that the testing we are using in development is the same as what we are using in the component library. Having the errors highlighted in the component library also helps everyone on our project teams catch accessibility issues as they are browsing the library, either for QA purposes or design inspiration.

Setup

The setup for Storybook is a bit more involved, so if you haven't used Storybook before, you can checkout the Storybook for React documentation for a generic React setup.

If you want to get Storybook running with Gatsby, see Visual Testing with Storybook in the Gatsby docs.

Once you have Storybook setup, adding the accessibility add-on is pretty straightforward.

First, install the add-on:

npm install @storybook/addon-a11y --save-dev

Then add this line to your addons.js file in your storybook config directory:

import '@storybook/addon-a11y/register';

And lastly, add this line in your Storybook config.js file to automatically add the accessibility panel to all components:

addDecorator(withA11y);

When you run Storybook now, you should now see the accessibility panel (see a live version here):

Our storybook configuration has built-in axe tests for each component and a color blindness simulator, provided by the storybook accessibility add-on.

Our storybook configuration has built-in axe tests for each component and a color blindness simulator, provided by the storybook accessibility add-on.

As a side note - you can control the order of the tabs in your add-ons panel based on the order that you import add-ons into your addons.js file, if you want to have the accessibility panel display by default, make sure it is the first line in your addons.js.

Wrap up

If you didn't follow along with the setup or just want to get a new project setup quickly with this workflow, checkout the gatsby-starter-accessibility Gatsby starter!

You can create a new Gatsby site with all the configuration I described above out-of-the box with this single line in your terminal:

npx gatsby new my-accessible-project https://github.com/benjamingrobertson/gatsby-starter-accessibility

Or you can checkout the specific configuration in the repo.

Whether you ran through all the steps above or use with the starter, you'll have the following features set up in your Gatsby / React project:

  • in-editor reporting of accessibility errors
  • a pre-commit hook for preventing accessibility errors from getting into the repository
  • browser console reporting of accessibility errors during development, with links to info on how to resolve the errors
  • a component library with built-in accessibility testing so all project stakeholders can hold the team accountable for accessibility issues
     

On a complex project with many team members and moving parts, automating accessibility testing will help save time to make sure you can pay more attention to the accessibility tasks that can't be caught by automated tests. 

Beyond that, tools like this can really help developers level up their accessibility knowledge.

I know it's helped me--I hope it helps your team too!

Jun 03 2019
Jun 03

By nature, menus are complicated. They’re not easy to work with, build or style, and yet they are probably the single most important navigation element of any website. Despite their complication, they need to be perfect to serve their purpose. A menu can make or break a website. They can make your browsing experience a pleasant one, or can drive you to leave a website frustrated and likely never to return.

When it comes to menus and forms, it is best to let Drupal dictate the direction rather than build them independently of Drupal. By adhering to Drupal’s best practices we can save a lot of time, effort and frustration. For example, rather than writing your menu’s markup before you see it being printed by Drupal, it is best to build your menu in Drupal and see what the markup looks like. Then you can use Drupal’s markup as a starting point for writing your menu’s markup. 

This is going to be a lengthy post (mostly because it includes a lot of code snippets), but this article will cover all you need to accomplish the following:

Build a multi-level menu component in Pattern Lab

Let’s start by building a pretty straight forward multi-level menu component in Pattern Lab. If you’ve used Pattern Lab or KSS Node you know most components require at least three files: 

  • .twig for the component markup and logic,
  • .yml or json for the component data or dummy content
  • .css or scss for the component styles
  • In some cases you may also need a Javascript file
     

For more in-depth explanation on building and integrating components read our blog series.  
Note: This series is over two years old and many things have changed since then, but the basics of building a component still apply.

Building the component

If the code above does not look familiar to you it’s probably because you’ve never used a Twig Macro. I will explain the macro in detail shortly, but for now let’s move on to completing the component.

  1. In your theme’s components location create a new directory called main-menu
  2. In the main-menu directory, create the following three files:
    • main-menu.twig
    • main-menu.yml
    • main-menu.scss
  3. Inside main-menu.yml add the code below:
  4. The data above represents an array of items. Each item has 3 key/value pairs: Title, URL and menu_level.  Each item represents a link in the menu.  You may notice some of the links have nested arrays (i.e. below). These represent submenus in the menu tree. The items array above is only intended to simulate the menu’s data for our component. In Drupal the array will be provided when we add menu links to Drupal’s Main Menu.
  5. Inside main-menu.twig add the code below:
  6. Finally add the following styles in main-menu.scss

These styles are as bare as possible. They are simply to make the menu look presentable and could use a lot of improvements. This is what the multi-level menu looks like:

multi-level menu

It’s important to note that the component will simply be used for styleguide purposes. We will create a similar component for Drupal, but we will use the original component above as a base for markup styles and behavior.

Why do we need to create a duplicate component for Drupal?

Drupal provides attributes Pattern Lab does not understand. Rather than over complicating the component, we are going to keep it simple for styleguide purposes while the Drupal version is more elaborate with all the things Drupal needs. This is not required but provides more clarity to the process.

Create a Twig template suggestion for the main menu

Our ultimate goal is to update Drupal’s menu system to render with similar markup as the main-menu component. This will require several steps which we will cover next.

Follow these steps to enable Twig Debugging in your theme. Then, you can inspect your site, which will allow you to see the various template suggestions that Drupal uses to render the page; including your navigation menu. The debug information looks like this:

Under File Name Suggestions notice two template names: menu.html.twig & main-menu.html.twig. The X next to menu.html.twig indicates Drupal is using this file to render the Main Menu. The second file, main-menu.html.twig, is what Drupal is suggesting we create if we only want to alter the Main Menu and not other menus.

Under Begin Output notice the path where menu.html.twig can be found, the example above is pointing to Drupal’s stable theme.

To ensure we only affect the main menu and not other menus on our site, we are going to make a copy of Drupal’s menu.html.twig in our theme and then override it. This is recommended rather than modifying Drupal core’s template. Let’s start:

  1. Copy the menu.html.twig template from core/themes/stable/templates/navigation/ into [site_root]/themes/custom/<your-theme>/templates/navigation/menu.html.twig (if these folders do not exist yet in your theme go ahead and create them).
    Following the golden rule “Never hack core”, we want to make a copy of Drupal’s menu template in our own theme. Replace the core theme’s name with your core base theme if you are not using stable.

  2. Next, In your theme rename the newly copied template to main-menu.html.twig.
    Copying menu.html.twig into our theme will affect other menus. This is why we are renaming the template so it only affects the main menu (main-menu.html.twig). Replace ‘main’ with whatever your menu’s machine name is if you are not using Drupal’s Main Menu. This can be found in Drupal’s Menus page (admin/structure/menus).

  3. After clearing Drupal’s cache, inspect the menu again and you should see the X next to main-menu.html.twig which means Drupal is now using our custom twig template suggestion to render the menu.

Create a multi-level menu in Drupal

  • Let’s make sure we have a menu we can see in Drupal. Let’s create a multi-level menu using the Main Navigation menu (Structure | Menus | Main Navigation).

  • Add as many links as you wish. Be sure to add nested items so we end up with a multi-level menu.

  • In addition, ensure each of the submenu’s parent links are set to “show expanded”. You will see the option on the Add/Edit Link page.

  • Finally, go to Structure | Block Layout and click Configure next to Main Navigation

Customize the template suggestion

Before we look at the code inside menu.html.twig as it may look confusing or not familiar, we are going to move it into the same directory as the main-menu component. We are doing this to make some improvements to the macro.

  1. In the same directory where you created the main-menu component, create a new file called _main-menu-macro.twig (notice the underscore as first character of file name). This file is only for Drupal purposes and we don’t need it to be shown in Pattern Lab. The underscore allows Pattern Lab to ignore it.

  2. Copy all the code from main-menu.html.twig into _main-menu-macro.twig.

The above code is a Twig Macro. Macros are the Twig version of functions. Just like you would write a function in PHP to do something and return something, you can use a Twig macro to generate some output.

Rendering menu with default macro

If we were to use the macro provided by Drupal as is our menu would render at its simplest form with minimum markup and almost no semantic css classes. See example:

The markup above may look different depending on your base menu. The classy base menu may show more markup but it does not make our job easier to style the menu.

Update Drupal’s menu macro to match our component’s markup

Not having the right markup for the menu, or any other element for that matter, can really complicate things for us when it’s time to style. We are going to modify the macro so it matches the markup of the main-menu component, and as a result the styles we wrote for the component will apply to the Drupal menu.

Menu Macro explained

Let’s step through this macro line by line to understand what it does. To keep things simple we are going to ignore all the custom classes we added above and focus on the macro itself.

  • Twig macros can be called from other twig templates; and it's also possible to place the macro within the same twig template from which you call it. The context is used in this case (line 21). So, with this import statement, we imported the macro and set it as a variable called menus.
  • Using the menus variable we then assign a name to it (main_menu), (line 23), which will take the following parameters: items, attributes, and 0). This name can be anything you wish.
  • Now we declare the macro again but this time with its new name, main_menu,( line 25), and pass the slightly modified parameters items, attributes, menu_level. We've changed the menu_level to a variable. If you are wondering where these parameters come from, the comments above the macro code in menu.html.twig provide all these variables.
  • Now that we’ve updated the arguments, we self import the macro again to make use of it (line 26).
  • Before writing any markup, we first check whether there are menu items to render (line 27).
    • If there are items in our main menu we start writing the markup. However, since we may have a multi-level menu, we want to make sure we identify the top level menu from nested (submenus), menus in the tree.  
    • This is where we first check if the menu_level is 0 (zero).
    • If it is the top level menu, we print a <ul> and we pass Drupal’s attributes in addition to our custom class.
    • If menu is not top level (submenus), then we simply print a <ul> with its corresponding class.

Learn more about Macros in Twig Templates.

Looping through the menu tree

Looping through the items array allows us to intersect each item and apply classes or attributes.

  • First we loop through the items array (line 33), and for each item, we print a <li> some classes which can be helpful if we need to style the different states of the menu.
  • For each link in a list item, we pass two things:
    • The node title
    • The node url
  • Inside the list item, we check to see if that particular item has other items or submenus.
  • When submenus exist, we make use of the macro again to repeat the process of printing the menu. This is where the macro saves us from writing duplicate code.
  • For each level of submenus we are increasing the menu_level by 1 and printing it as part of the submenu class. This is handy if we want to target a specific submenu in the tree.
  • Finally, we close all previously open actions/tags (i.e. for loops, if statements, lists, and macro).

RESOURCE: I recently ran into a blog post by Tamas Hajas where he has a great way to address classes and states on a menu. Check it out Drupal 8 Twig: add custom CSS classes to menus

Looking at the rendered menu after Macro improvements

Now that we have a better understanding on how the macro works, and after making the improvements discussed above, the markup for the menu would look something like this:

Integrate the Main Menu component with Drupal’s Menu

The last part of the process is to integrate all the work we’ve done with Drupal, so our Main Menu is rendered with the markup, styles and behavior we implemented when we built the component.  

  1. >In your editor, open [site_root]/themes/custom/<your-theme>/templates/navigation/main-menu.html.twig
  2. Delete all the content in the twig template except for the comments, and then paste the code below into it
{{ attach_library('your_theme/main-menu') }}
{% import '@patterns/main-menu/_main-menu-macro.twig' as menus %}
{{ menus.main_menu(items, attributes, 0) }}
  1. Clear Drupal’s cache
  2. Reload Drupal’s page

Since we moved the macro to the component’s location, all we need to do in the main-menu.html.twig template is to import the macro and provide the parameters the macro expects. These parameters can be found in the twig template’s comments.

If we did our job right, Drupal’s menu should now look and behave the same way as our component. In addition, if you inspect the Drupal page, the menu should reflect the same markup as the main-menu component.

IMPORTANT: If you are using the Main Navigation blog to position the navigation where you want it in the page, you may need to make a copy of the twig template for that block in order to assign the main-menu class the menu needs.  

Drupal Libraries

As a best practice, we should create a drupal library to attach any styles and javascript to our component. See this article for adding CSS and JS to a page or component.

In our case our library would look like this:

main-menu:
  css:
    component:
      dist/css/main-menu.css: {}

This library has already been attached above inside menu--main.html.twig

By doing this any styles we wrote for the component will apply to the main navigation when it’s rendered in Drupal. Drupal libraries have no effect in Pattern Lab.

After completing the steps above, clear your Drupal’s cache and reload your Drupal site. You should see your Drupal menu being rendered with all the styles and markup we wrote throughout this post.

In closing

I’d like to admit that I went about the long way to get the main menu working on both, Pattern Lab and Drupal. There are other ways to accomplish this by using contrib modules such as Simplify Menu (full disclosure, I helped create the module), and perhaps Twig Tweak among several others, however, the approach I took here gives you the most control and that can make all the difference if you are dealing with a pretty advanced or complicated menu.

Jun 03 2019
Jun 03

In the battle for insurance customer loyalty, the best customer experience wins. Equipped with a powerful content management system (CMS) like Drupal, insurance web teams are prepared for a competitive landscape crowded with fast-on-their-feet insurtech startups and looming giants of tech, Amazon and Google

The Drupal 7 Versus 8 Debate: A Team Approach 

Drupal 9 is coming. With the release just under a year away, the time is now for insurers’ teams to resolve their internal CMS debate — remain on Drupal 7 or upgrade to Drupal 8?

Bridging the customer experience gap is no small feat. However, insurance business leaders, marketers and developers are tackling the challenge head on. They comprise the team of experience builders with seats at the table for decisions like a CMS upgrade. To forward growth, their technology decisions are prioritized by data security and cost control. Also topping the list of evaluation criteria is a capacity for continuous improvement and swift speed to market of applications and functionality. Business leaders, marketers and developers bring unique approaches to achieve these common goals. In this article, we’ll evaluate Drupal 7 and Drupal 8 through the lens of these three stakeholders.

Current Drupal 7 sites have captured a glimpse of why Drupal is a fit for insurance, but the real power lies within Drupal 8. Of course, the decision to upgrade requires thoughtful consideration and planning. It’s a significant undertaking, particularly for large sites. However, factoring in the robust features of Drupal 8 with the appealing innovation forecast for Drupal 9—and the simple upgrade path connecting the two—insurers are likely to find that the advantages of upgrading far exceed the disadvantages. 

Drupal 7 Versus Drupal 8 for Business Leaders

Business leaders’ roles and responsibilities revolve around improving operating efficiency and cutting expenses. A flexible technology stack is crucial to stay competitive, perhaps even opening doors to collaborate with emerging insurtech startups. 

Focusing on the bottom line, insurance business leaders are understandably concerned with forecasting migration costs. 

Gaining a Competitive Edge 

With Drupal 8, insurers can gain a foothold to gain, and keep, a competitive edge in the market. 

  • Drupal 8 core offers many advantages, including improved performance and a better editorial and developer experience, to close the innovation loop.
  • To support the leap from Drupal 7, Drupal 8 now includes a built-in user interface to streamline migrations and offers more support for multilingual migrations.
  • More accessible web forms and other accessibility improvements in Drupal 8 serve to support legal compliance efforts and extend insurance offerings to the widest possible audience.

Benefits of Drupal 8 

business benefits of Drupal 8

Source: Mediacurrent

The many advancements in Drupal 8 core are reason enough to consider an upgrade, but contributed modules represent the best innovation in the Drupal ecosystem. The brilliant and globally spread Drupal community has shone a spotlight on Drupal 8. Drupal 7 simply hasn’t received the same level of enhancements and attention. Furthermore, passing on Drupal 8 now can also mean missing competitive advantages during the waiting time before Drupal 9. 

Looking ahead, moving to Drupal 8 now will make for an easier transition to Drupal 9. In the words of Frank Sinatra, “The best is yet to come...and won’t it be fine” (or should we say, nine?).   

Estimating Effort and Cost

Insurance business leaders are naturally concerned with total cost of ownership for their Drupal CMS. The migration roadmap is an important factor in that equation. 

Can you take your time to upgrade for Drupal 9? The answer is, technically, yes — but consider both migration and opportunity costs.  After clearing the jump from Drupal 7 to Drupal 8, expect future upgrades to Drupal 9 and onward will be significantly easier. 

Drupal 8 marked the beginning of a new continuous innovation model where advances in functionality are released rapidly on a six-month release cycle. Also, the Drupal 8 architecture is tuned so that a simplified upgrade path awaits to Drupal 9. This approach allows you to benefit from the innovation of Drupal 8 as Drupal 9 brews in the same codebase. 

Mediacurrent’s Drupal 9 Upgrade Guide can help prep your site for the move to Drupal 9. 

Drupal 7 Versus Drupal 8 for Marketers

Insurance marketers of all types, e.g., home, auto and life, view the customer experience as synonymous with digital experience. They have watched customer loyalty dwindle as the market has shifted online, where it’s never been easier to switch providers and shop online for quotes.

Earning Loyalty, Improving Customer Experience

Drupal 8’s appeal to marketers has grown significantly with major releases emphasizing ease of use and customer experience. Insurance organizations like MagMutual have embarked on the transition from Drupal 7 to Drupal 8 to better serve marketing teams:

Our Drupal platform allows our team to adapt to that very quickly to change marketing strategies as we continue to grow and evolve with our customer base.

Sallie Graves, CIO, MagMutual

Catch up on our CIO Interview with MagMutual to see how the organization is bringing new engagement strategies to life on an adaptable platform.

The key to forging deep customer loyalty lies in improving the customer experience from start to finish. In evaluating a CMS platform, marketers need a solution to tighten the reins on data so that it can be applied to the customer experience. 

For Guardian Insurance, Drupal 8 was a savvy place to land. Read Guardian’s Drupal 8 case study to see how they built a data-informed customer experience to win millennial insurance shoppers. 

Our Drupal 8 platform will serve as a foundation as we scale and enhance our web and mobile experiences for customers.

Peggy Maher, SVP, direct to consumer at Guardian Life Insurance 

Drupal 8 and Modern MarTech Stack 

Insurance marketers on Drupal 7 have most likely been with the same platform for a few years. If that rings true for you, consider the strategic doors that an upgrade can open. Think big about your website as a business tool. 

Consider questions like:

  • Does your conversion rate, bounce rate, site traffic and page load time indicate it’s time for a redesign?
  • Do you have a solution for customer journey mapping? Can you see what works, what doesn’t and, most importantly, why to engage prospective and current customers?
  • What usability improvements can help shape the customer experience?
  • Are there any areas of your digital presence lacking in personalization?

Drupal 8 is built for easy integration with your current and future marketing toolkit. Connect marketing automation, email service providers, CRM and more with Drupal 8 as the foundation for your digital experience ecosystem.

Drupal 7 Versus Drupal 8 for Developers

Security 

Developers in the insurance space are tasked with managing the security implications for mountains of personal data and sensitive information. 

We mentioned previously that the developer community has been laser focused on innovation in Drupal 8 —this also applies to security. Major security flaws are first found—and first fixed—in Drupal 8. If that’s not reason enough to contemplate a move to Drupal 8, consider also the security implications of Drupal 7’s impending end of life where core maintainers check out of security duty.  Beware— your site’s data could become vulnerable to hacking and other exploits. 

A study from 2018 found 63% of hacked sites running Drupal had outdated versions when breached.  

Ahead of the Curve 

The Internet of Things (IoT), which includes smart home devices and new telematics solutions, gives insurers a new opportunity to learn from customers to serve them better. Beyond just a website, insurers need to meet customers on their screen of choice. Whether it’s mobile, wearables or smart home devices, screen time is all the time. Drupal 8 core is built with the elasticity to accommodate customers’ devices of today and tomorrow. 

For more considerations from a site builder’s perspective, read 10 Reasons Why You Should Start Your New Project in Drupal 8 on the Acquia Developers blog. 

Conclusion

For insurance providers, digital transformation is where customer experience meets Drupal 8 technology. With a highly proactive community behind the screens, the Drupal project is paving the runway for next-generation customer experiences. 

Drupal 7 to Drupal 8 converts like the State of Georgia and Pegasystems are but two examples of large, complex sites that saw significant gains from their migration. Acquia and Mediacurrent have proudly supported these organizations on their Drupal journey. Watch their migration stories here

Master Your Drupal 8 Upgrade With a Trusted Partner

The final crucial consideration on the road to adopting Drupal 8 is choosing a migration partner. As a leader in Drupal development, strategy and design, Mediacurrent has partnered with high-profile clients ranging from large enterprise businesses to education. Together with Acquia, our talent, tools and processes ensure a smooth and successful migration. Partnering with us will help you establish the personalized digital experiences that capture customer loyalty — leveraging flexible open source technology and with the lock-tight security the industry requires.

May 31 2019
May 31

For all its benefits, working remote— as most of our Mediacurrent team does— still has its challenges. 

The one that people ask me about the most is, "how do you keep any kind of work / life balance when your work and home are inseparable?" For me, the answer to this has been what I call my "shutdown ritual." It's basically just how I try to end my workday every day, but I've found putting some thought into a routine has helped a lot to make my evenings more relaxing and my mornings more productive.

In this post, I'm going to cover:

  • what a shutdown ritual is
  • the benefits  of having a shutdown ritual
  • my specific shutdown ritual

What is a shutdown ritual?

So first, what is a shutdown ritual?

A shutdown ritual is a set routine of actions that you perform at the end of each work day to finalize your day and signify that your work day is done.

I got this concept from an excellent book called Deep Work: Rules for Focused Success in a Distracted World, by Cal Newport. 

His core argument in the book is that the most valuable skill in our economy is deep focused work and that is becoming increasingly rare. If you want to set yourself apart, cultivating a deep work ethic is the way to go. He outlines several rules and guidelines you can follow to start cultivating this habit.

One of the tools he recommends is the shutdown ritual.

The bare outline of the shutdown routine that he outlines in Deep Work is:

  1. update all todo lists
  2. read over the todo lists in their entirety (reprioritizing items as necessary)
  3. review the calendar for the next two weeks, make sure any todos required for events are on the todo list
  4. write down a plan for the next day
  5. close everything on your computer
  6. say a magic phrase, like "Shutdown complete" or "I'm outta here"

Newport also discusses the shutdown ritual briefly on his blog: Drastically Reduce Stress with a Work Shutdown Ritual.

Why do a shutdown ritual?

One of Newport's biggest criticisms of modern workers is that we're always on, and because of this, our attention and energy is too dispersed. We can get notifications or just compulsively check Slack or email, even outside of work hours. But deep work requires disciplined attention and energy. If you want to do deep work during the day, you need to make sure you are not constantly doing shallow work (even off the clock). 

Benefit 1: A defined ending

One of the main benefits of the shutdown ritual is having a well-defined end of the workday. Once the shutdown ritual is done, work is done. Don't think about it. Don't worry about it. Don't check email. Don't look at Slack. If you want to be your most productive self, you need to take a complete break until the next work day.

Now it's time to do all the relaxing evening things like feeding your kids and washing the dishes.

When I tell people I work from home, a majority of them say something like, "You must feel like you're working all the time" or "How do you separate your work life from home life?" and I have certainly found it to be a bigger challenge to turn off at the end of the day since I don't really leave "the office." The shutdown ritual helps define the end of the workday and the beginning of being fully present at home.

It has helped me be more productive during the day and helped me have more focused attention with the family after work.

Benefit 2: Confidence in the ending

The important part about the steps in the shutdown routine is giving you confidence that everything you needed to do is done. 

If you're like me, you might be washing the dishes and still be debugging code in your head. Or you might suddenly remember an important email you were supposed to respond to and didn't. Or you might start thinking about a meeting on your schedule tomorrow that you're anxious about.

But the steps of your shutdown ritual should help you capture all these thoughts before you end your workday. You want to capture them and write them down somewhere, so they aren't floating around in your brain all night. 

Sometimes, you might be in the middle of your shutdown ritual and remember something that can't wait until tomorrow. That's fine, go ahead and do it and then start your shutdown ritual over.

Because once your shutdown ritual is over, and a work worry comes into your head, you want to be confident to say to yourself: 

I went through the shutdown ritual. I know that everything important has already been accounted for. Therefore, there is no need to worry.

And move on with your night.

Benefit 3: Having an anchor for other habits

The last benefit I'll mention is that having a shutdown ritual at the end of the day can be a helpful anchor for other habits.

If you have a well-established habit like a shutdown routine, you can leverage it to help establish other habits. James Clear calls this Habit stacking. The idea is that by pairing a new habit with one that already exists, you make it more likely to stick to a new habit.

Some examples of habit stacking with the shutdown ritual:

  • after my shutdown ritual, I will take 5 deep breaths and smile
  • after my shutdown ritual, I will put on my workout clothes and go to the gym
  • after my shutdown ritual, I will call a friend
     

A shutdown ritual can help you end your workday productively and launch a new habit or hobby to make the rest of your life even better as well!

My Shutdown Ritual

Here's what my shutdown ritual looks like. At 5:15pm everyday, I get a friendly message from slackbot to start my shutdown ritual. 

You can set a reminder in Slack like this:

/remind me to 

Time to start your shutdown ritual!

- reconcile timesheet
- check email for anything requiring urgent response
- add new / outstanding tasks to todo list
- check JIRA
- skim task lists
- check calendar for tomorrow
- make a rough plan for the next day

Shut down complete

every weekday at 5:15pm

For me, this is actually about 45 minutes before the end of my workday. I used to have the reminder for 15 minutes before I signed off, but I could never get to a stopping point and do the shutdown in 15 minutes. 45 minutes gives me enough time to start looking for an exit in my current work and to go through the routine.

Here is what is on my shutdown ritual list:

  • reconcile timesheet
  • check email for anything requiring urgent response
  • check JIRA
  • add new / outstanding tasks to todo list
  • skim task lists
  • check calendar for tomorrow
  • make a rough plan for the next day
     

Reconcile Timesheets

I take a look at my time tracking software and make sure all my time is accounted for.

Check Email

I go through my email inbox, responding to anything that is really urgent, and adding tasks to Todoist for anything that is not. My goal is to delete as many as possible.

Check JIRA

I open up JIRA to see what tasks are assigned to me, and add them to Todoist, if they aren't already there. I sometimes remember things I said I was going to do but didn't (like update a ticket or assign to someone else) so if I can quickly do that I will.

Skim Todo lists

This gives me a broad view of what's going on. Sometimes I notice a glaring error or remember something that completely slipped my mind, so I add that here. I also sometimes reorder things based on how priorities changed throughout the day.

Check Calendar

Next, I check my calendar for tomorrow. Do I have any meetings tomorrow that I have a deliverable for? Did I complete the deliverable? Any conflicts?

Make a rough plan for the next day

The last item on my list is making a rough plan for the next day. This really sets me up for success in the morning, and helps prevent a slow, groggy start to the work day. Sometimes I make my plan in Todoist just by setting due dates for todos for tomorrow and putting them in the order I want. Other times I have a simple text file where I make a list. It kind of depends on what projects I'm on and the kind of work I'm doing from week to week.

Shut down

I close all applications on my computer. I put the computer to sleep or shut it down. Sometimes I say "shutdown complete"

Sometimes here I tidy up my desk.

I start singing "It's a wonderful day in the neighborhood" and change into my house sweater and house shoes.

The work day is done. I'll be back tomorrow. 

And that's how I end my days productively with the shutdown ritual.

May 31 2019
May 31

Mediacurrent's Rain Install Profile logo

Mediacurrent created the Rain Install Profile to build fast, consistent Drupal websites and improve the editorial experience. Rain expedites website creation, configuration, and deployment.

The Mediacurrent development team is pleased to announce some new updates to the Rain distribution in version 3.0. We have now made Drupal project template easier to use and maintain by splitting Rain content features (all of which are optional) from the main “base” package. This allows developers flexibility in which features they use while still pre-configuring modules that jump-start development.

There are some key changes that we will highlight here:

  1. The Rain package has now been split and renamed to mediacurrent/rain and mediacurrent/rain_features respectively. The latter repository now contains all the optional content features and their dependencies while the base package pre-configures the base installation.
  2. An UPDATE doc has been added to the Rain repository which explains in detail how to update from the 2x branch to 3x. This document will be kept up to date with any future changes that require manual changes or explanation.
  3. A few new dependencies have been added while several less frequently used dependencies have been removed. The UPDATE doc gives further details on what was added or removed and how to upgrade.

Note that the Drupal-project template is only used for provisioning new projects. Any project that currently uses the 2x version of the Rain distribution will not break or be forced to update. Updates to 2x will continue through to Drupal core 8.8 but then be sunset in favor of the 3x branch. Overall the process of updating from 2x to 3x should be relatively painless. 

If you experience any problems updating please file an issue in the official Rain project queue on Drupal.org: https://www.drupal.org/project/rain.

Installing Rain 3.0

To install the Rain distribution, we recommend you leverage our Drupal project template which includes a VM and Guardr security along with the Rain install profile and other tools.

Our recent article entitled “Drupal 8 Rain & GatsbyJS Integration” covered how to install Rain using the project template so we will recap the first step here which remains the same in version 3.0. 

First you will want to create a repository wherever you typically host your Git projects (i.e. Github, Bitbucket or Gitlab). Once you have that setup you can clone Mediacurrent’s repo and point the origin back to your Git repo.

Example:

git remote set-url origin [email protected]:mediacurrent/shortcode_project.git

Next, you will want to initialize the project. You can do that by running the following commands with your local host name and IP.

Example:

composer install

composer drupal-scaffold

./scripts/hobson project:init example.mcdev 192.168.50.4

Finally, to build the project and run the install you can simply run “./scripts/build.sh” which runs composer install as well as the Drupal install. Note that the project README has more detailed instructions but this will give you an idea how to get up and running quickly.

Video Tutorial for Installing Rain

[embedded content]

Related Resources

[Webinar Recording] Rain + GatsbyJS: Fast-Tracking to Drupal 8

May 29 2019
May 29

Have a few menus on your site & looking for a quick way to add or change the menu classes and attributes? Use the theme_menu_tree__[menu_name] override in your theme’s template.php file to change Drupal 7 menu list class and attributes:

// template.php

/**
 * Override theme_menu_tree().
 */
function theme_menu_tree($variables) {
  return '<ul class="menu">' . $variables['tree'] . '</ul>';
}

/**
 * Override theme_menu_tree__[menu_name]().
 */
function theme_menu_tree__main_menu($variables) {
  return '<ul class="menu">' . $variables['tree'] . '</ul>';
}

The code above will allow you to easily change all menu ul classes and other attributes or just the main menu’s ul classes and attributes.

Change Drupal 7 Menu List Class

Looking for a module to change Drupal 7 menu list class & attributes?

Unfortunately, I haven’t been able to find one that handles the individual menu ul instances cleanly, but the Menu Attributes module is a start. It gives users the ability to set the following attributes for each menu item — this does not help with setting the ul classes & attributes:

  • id
  • name
  • target
  • rel
  • class
  • style
  • accesskey

What about Drupal 8? Check this out article out by Tamas Hajas: Drupal 8 Twig: add custom CSS classes to menus (based on menu name).

Related Articles

Like this:

Like Loading...

May 29 2019
May 29

Gaining approval to launch a new website is a big investment — and it’s expected to achieve a big reward. Your internal team (and customers) expect it to match up to their favorite website. That could be Amazon, Apple, or any number of well-known brands relying strongly on their website.

Needless to say, the expectations for a new website are very high, regardless of your budget. Compounding the challenge is the fact that a site build remains a complex process due to technology, expectations, diverse perspectives, and competing goals within the organization.

The challenge for the business is that a new website build is not standard operating procedure. It is not something that is done regularly. It is often resisted by the internal users because as much as people want the latest and greatest site, they may also fear change. So the risk-reward can be very high for the person in charge of the project, but selecting the right digital agency and leveraging your agency-partner relationship can tip the scales in your favor. Your agency-partner, let’s say partner, can help you, because it is standard for them.

Perspective from both sides of the aisle 

My career experiences have given me a broad perspective and good understanding of the internal challenges one faces to get buy-in for a major website re-build project.

Today, as a Mediacurrent Project Manager, I primarily work with existing clients for both site builds and post launch support, and I also work on pre-sale projects.

I was previously hired by a top 20 medical device manufacturer into a new position responsible for Online Marketing Strategy and Analytics, reporting up to a reasonably new head of the department of Marketing Services. Up to that point, online marketing and the website was not a focus for the marketing team. We made the case for a new website, got management and budget approval, chose Drupal, and I managed the entire process — including vendor selection.

The RFP Process

  • If you have an existing agency partner, they can help you. It would essentially be consulting time, but often the partner sees a lot of RFPs and can identify areas that you may have missed.

  • Have a diverse group of people involved in the process. This can make the process slower, but can help significantly in the end if you have early buy-in from all the right parties.

  • Accept what you think is fair based on the request vs. resources and experience being made available to you. You may not always have the names of all the individuals assigned to your project, but the partner will ensure the resources meet the need.

Development

  • If the partner doesn’t offer, ask for regular demos of functionality throughout the development phase. This will help you see the work being done and you can make adjustments as needed. Be careful with adjustments though. You want them to be clarifications and not changes to the original scope of work.
  • Don’t go short on Quality Assurance (QA) time. Partner QA teams do nothing but QA and are well versed at finding things you may not think to look for. Allow the partner to QA each ticket you review. If you by-pass QA or do it yourself, you run a high risk that there will be issues and ultimately misses.
  • Keep your stakeholders abreast of the work being done, so they see progress. Invite them to the demos and reconfirm their approval.

Training Internal Users

  • During development, begin planning for training your internal users. Without their buy-in, you will fail. Keep them informed of the progress and if possible create a campaign that raises awareness and keeps the project top of mind.
  • Be sure to build your site with help text for each field. When demos take place, have them recorded so you have videos of both front and back end for the users to understand how what they insert is rendered.
  • Your partner can help plan training sessions to get everyone acclimated to the new system.

Post-Launch

  • Websites are evolutionary; new features and functions arise as users get acclimated to them. Most likely there will be items that didn’t make the initial launch in order to keep within time or budget, but having a support agreement will allow you to continue to improve your site. If necessary, have your partner convey the fact that these new features and functionalities are possible, but can be done post-launch to keep the project on time.
  • Reporting is critical. While this has to be established during the development phase, you need to develop a series of reports. There should be a report for the product team with specific areas for them to focus on and the senior management team, which wants to know if their investment is paying off. Your partner can help develop these as they have done them for other clients in the past, as opposed to taking time to do it yourself.
  • Your hosting and development companies need to work in unison, and sometimes this can be more than two companies. Keep them connected to ensure the entire platform is optimized.

While these are high-level considerations, I believe they are all critical to success. When you have the opportunity to build a new site or revise an existing one, following these guidelines will put you in a position to be successful and to leverage that success to a promotion.

May 29 2019
May 29

May has been most generous with us, no doubt about it: it has "spoiled" us with a heavy load of both useful and usable Drupal content. The community has been altruistic enough to share their “enlightening” experiences of working with Drupal, their discoveries and latest contributions. As for us, we "feasted" on their articles and tutorials, even managed to sync all our personal tops and to come up a unique "best Drupal blog posts” list for this month.
 

Ranging from valuable tutorials to overviews of the latest Drupal releases, to glimpses of these Drupal contributors' hard work, our selection is as varied as it is valuable.
 

Now, in the name of open source we're ready to share our selection with you, OPTASY team's 5 most appreciated Drupal blog posts in May:
 

Drupal 8.7 had just been "taken out of the oven", it was still steamy fresh when the Srijan team published their inventory on its new features and newsworthy updates.

From:
 

  • JSON:API now in Drupal 8 core
  • to the Media Libray module, that grew from experimental to stable 
  • to the "rockstar" Drupal 8 module, the Layout Builder, that turned stable
  • to the newly improved configuration management system
     

... and other upgrades, updates, and newly added features, they managed to include in their post all the "highlights" of this Drupal minor release.

And, most of all, to do it promptly enough to be among the first (if not the first) to share their overview on the release with the world/the Drupal community...
 

Another piece of content that made it to our “best Drupal blog posts” list this month has been Matt Oliveira's tutorial on how to use Laravel's Homestead for Drupal local development.

He first adds some sort of context to justify his choice (since he used to go with Vagrant for his Drupal projects), then he explains, step by step:
 

  • what software you need to install, first things first ( VMWare, a VM provider, Hyper-V, Vagrant, etc.)
  • how to install and setup Homestead using Composer, but only after you've first cloned your Composer Drupal project
  • the command to enter for... launching it, after you've run all the due configurations
     

And his clearly formulated and practical tutorial goes all the way to the cool features that Homestead will provide you with and some useful warnings to keep in mind.

Have you used Homestead for your local development when working on your Drupal projects before?
 

Did the “secure Drupal” frenzy get you, too, last year? Particularly after the Drupalgeddon attacks?

Then you must have rushed to:
 

  • implement all the security best practices out there
  • put up a thick security shield around your Drupal modules and your Drupal theme
     

But did you know how insecure Drupal code even looked like?

And it's precisely this rhetorical question that generated the ThinkShout team's blog post.

They point out that:
 

  • way too many Drupal developers risk to “host” insecure code under their websites' hoods without even knowing it
  • most of us genuinely assume that all Drupal APIs are safe
     

Next, once they point out the issue(s), they enlist several exploitable holes that you could identify in your code, grouped in 3 main categories:
 

  • XSS vulnerabilities when rendering HTML
  • SQL injection risks
  • PHP code issues
     

A priceless resource to keep at hand and to tap into whenever we run our own code review sessions here, at OPTASY. One that we're most grateful for. 
 

It's useful, it's enjoyable, it's packed with helpful tips on both:
 

  • what optimizing images for the web really means; take it as a helpful checklist
  • what Drupal tools to use to... automate the whole process
     

And I'm talking here about the “Configure image styles” feature that enables you to define some sort of “pattern” to apply on all the future images on your website. One already incorporating all the due properties, the right width and height.

About the “Image toolkit” feature, that enables you to easily improve your image's quality. And the list goes on (with the Responsive Images module and so on...)

A way too valuable piece of content not to include it in our “best Drupal blog posts” list.
 

The real challenge highlighted by the Duo team in their post? Drupal site search in case of large organizations.

And their real struggle to look for a solution that:
 

  • would allow users to query across an entire ecosystem of websites and platforms
  • wouldn't put too much pressure on Drupal
     

In this respect, they bring to our attention a solution architected and developed by the Palantir team: the federated search.

Next, they back up their choice with strong arguments:
 

  • it's a robust enough search solution to meet large organizations' needs
  • being a decoupled solution, it leverages Drupal's powerful back-end without putting a strain on its front-end, as well
     

In short: for us, the OPTASY team, this post opened a world of possibilities. What if search in Drupal could be way more flexible, yet powerful enough to meet enterprise-level requirements?

And I'm thinking here of all our clients “juggling” with multiples websites...

 
The END!

These are the best Drupal blog posts on our monthly list. And we have to admit: picking just 5 pieces of content on Drupal was one hell of a challenge.

Photo by Daniel McCullough on Unsplash

May 28 2019
May 28

This is the second post in a two part series focused on specific platforms for experience-led ecommerce. The first post focused on Drupal, an open-source CMS, as an excellent option for creating content-rich customer experiences when combined with an ecommerce component of your choice. This post will focus on BigCommerce, an increasingly popular open SaaS ecommerce platform, and how its strengths in ecommerce can be complemented by an integration with Drupal.

A quick introduction

Like the last post, here’s a quick introduction to the main concepts and software discussed.

SaaS

Whether it’s accounting, marketing, ecommerce, etc., SaaS (software as a service) platforms are a great option for many businesses. With this service model, businesses simply sign up and pay a monthly fee to use the platform. This is an attractive option because the cost is generally quite reasonable and the onus is on the service provider, not the business, to host the service and keep it up and running. For a business, it’s hands-off and requires little to no IT staff to manage.

Open SaaS

Open SaaS is still a relatively new term and has a couple different meanings. For this post, I’m using open SaaS to describe a SaaS services that is also open for integration and innovation through APIs and webhooks. This means that a business can use the SaaS service as-is, but it’s not restricted by it. This will become more clear the further you read through this post.

BigCommerce

BigCommerce is gaining popularity as a SaaS ecommerce platform. As a service, BigCommerce provides everything a business needs to quickly create an online store and start selling products. It has a wide variety of customizable themes available, supports custom themes, and has an extension library to add additional functionality to the base platform. While this is all quite normal for SaaS ecommerce, what makes BigCommerce an exciting platform is it’s commitment to being open via APIs and webhooks. This allows BigCommerce to be used as a headless backend store management area with the front-end of your choice, opening up a world of possibilities for creating customer experiences not previously possible with other popular SaaS ecommerce solutions.

SaaS at different stages of growth

Ecommerce businesses can grow quickly. Being set up for scalability to handle this growth is extremely important early on to eliminate headaches later on. This is the main reason why all of us at Acro Media are always talking about the importance of utilizing the right commerce architecture. The right architecture will enable a business to scale effectively without bottlenecking operations with swivel-chair processes. BigCommerce is uniquely capable of handling this growth, from startup all the way up to enterprise powerhouse.

Click to discover your ideal architecture with our analysis.

SaaS for startup and small businesses

For many small ecommerce businesses, SaaS ecommerce platforms like BigCommerce provide a quick and cost-effective solution to get to market. These businesses typically have a low IT budget and are just looking for solutions that are easy to implement and use. In many cases, SaaS checks these boxes and is the perfect starting point. This is why platforms like BigCommerce, Shopify and SquareSpace have become so popular. We call this scenario commerce-led because the ecommerce platform used dictates what other software and integration are also used in combination.

SaaS for medium, large and enterprise businesses

While SaaS is typically great for startups and small businesses, established businesses are an entirely different situation. They’re now looking at technology as an enabler for reaching the next level. They see personalization and the customer’s experience as an area where they can differentiate themselves from their competitors. These businesses are now hitting the limitations and restrictions of their SaaS ecommerce platform due to the fact that SaaS is typically built for the most common use cases and is therefore rigid in allowing these businesses to add the unique functionality and the integrations that they need. As technological requirements for a business changes, the software used must change too. These businesses are now looking at investing in stable technology that increases efficiencies, automates time consuming tasks, and gives them the edge in defining their customer journey. This may mean moving away from a commerce-led architecture and into experience-led. Often, ecommerce replatforming is part of this move.

BigCommerce is different

So, where does BigCommerce and Drupal fit into the mix. As I mentioned earlier, BigCommerce as a SaaS service is an ideal ecommerce platform for startup and small business. Not only does it give these businesses the ecommerce tools and stability needed to easily conduct business online, but it’s uniquely capable of growing with these businesses further, all the way through to enterprise.

How? Through BigCommerce’s open APIs and webhooks, BigCommerce can be run headless as a robust and secure enterprise-level ecommerce backend that compliments the incredible content experience capabilities of Drupal as the frontend. This means that these businesses can start with a SaaS solution that works great and then replace the frontend with Drupal if and when it makes sense to do so. They integrate directly together, creating a SaaS & open source hybrid ready to disrupt the insanely expensive enterprise ecommerce space, finally giving companies a capable and cost-effective alternative solution that is built for growth, scalability and integration.

Why Drupal?

If you haven’t read the first post in this series, I’d recommend you take a moment to do that. It discusses the strengths of Drupal for experience-led ecommerce complete with some examples. In short, customer experience is seen as a major competitive advantage in established ecommerce and Drupal is able to provide that experience while also being able to integrate with the ecommerce component of your choice. One choices being BigCommerce.

How it works

Acro Media teamed up with BigCommerce to create the BigCommerce for Drupal integration, so we are very in-tune with the strengths of both platforms. Here’s a high-level breakdown of how the integration works.

  1. Set up a BigCommerce store
    The business signs up for an account with BigCommerce and adds products, payment gateways and shipping options as it normally would. The BigCommerce backend is used for all of the ecommerce functionality, so the store configuration happens here.

    As mentioned earlier, existing BigCommerce store’s don’t need to create a new store for this integration with Drupal to work. Drupal just replaces the frontend, so the integration can happen at the beginning or anytime in the future.

  2. Connect BigCommerce and Drupal
    Drupal is then installed separately and the BigCommerce for Drupal module is added along with any dependencies. The module’s settings page within Drupal is where the BigCommerce store is connected and products get synced. This brings the products into Drupal as content.
  3. Complete the Drupal website frontend
    The rest of the website is then built within Drupal like any normal Drupal website. This involves setting up additional content types, configuring the display of this content and imported products, and finally theming the site.

That’s it! Drupal is where the content lives and what customers interact with. Operational staff who manage the store and fulfill orders do so within BigCommerce. When customers decide to purchase products, they do so through an embedded BigCommerce secure checkout.

And there you have it, the best of both worlds!

Further information

Interested in learning how your business can leverage the strengths of BigCommerce and Drupal together?

Discover BigCommerce for Drupal

Or check out these related resources.

May 28 2019
May 28

As a marketer, you want to make sure that the content you create stays with them. But chances of standing out in the crowd are meagre.

Why?

Because

  • there's a lot of content out there on the web
  • you might not know what your visitor is looking for, so you are showing standard content
  • those of your competitors who do know the visitor needs and preferences have already started working on personalization
After all, personalized content does 212% better (Hubspot) than standard. Why should anyone miss it? 

While the value of personalization is clear, the task can be overwhelming to get started with. If your digital property is on Drupal, you can begin with some of the content personalization modules to yield higher ROIs.

But you must know the challenges before conquering them.

The Challenges with Content Personalization

Personalized messaging not only yields higher ROI but gets you more loyal customers. 45% of online users are more likely to shop on a website that shows personalized suggestions.

 

According to a 2017 research lack of resources (42 percent) and research data (23 percent) remain top challenges for marketers in implementing personalization.

Developing Content 

Content is the only component that's hyper-relevant to the concept. Catering a tailored experience means dynamic and coordinate messaging across multiple digital channels. The content cannot be isolated.

Having the right content strategy in place is crucial.  

Adding personalization to the mix, you’re dealing with the need for individualized content that fuels and satiates the psychological wants for different segments and personas.

personalization-srijan

In order to recommend that ebook on DevOps Consulting to a CTO, you need to have the basic content around.  

Gathering the Right Data  

While marketers realize that a data audit is important to understand the users, what remains a challenge is which data to refer to. For an effective implementation various pieces of customer data need to be brought together to assemble a complete view of the customer.

With a larger 'data lake' at work, identifying a single source of customer truth gets tougher.   

A Hubspot research found that targeted and personalized CTAs had a 42% higher view-to-submission rate than the ones that were the same for every user.


Well, it all can start off small with modules.

Content Personalization With Drupal

A big part of improving user experience comes down to validating the content on your website. Drupal already gives us structured content. Further, there is no restriction on which marketing tools you apply as the Drupal managed content can be turned into standardized data sharing formats with its API-first approach.

  1. Taxonomy: Taxonomy is the practice of classifying content. It is beneficial as it helps define the vocabulary for everything from menu and navigation schemes to view and display options.

    In Drupal 8, it is a core module which allows you to connect, relate and classify your website’s content. Taxonomy is important for personalization as it helps build associations between your personas and the personalized content you’ve created.

    It enable native or third-party personalization tools to identify and pick the right content to showcase to the right user. 

    This is most effective for making intelligent content recommendations content to the visitor. The vocabulary ensures your targeted persona is seeing all the content that's contextually relevant to their historical behaviour on your site.

  2. Smart Content Module: Moving a step beyond taxonomy, you would want to display targeted content that speaks directly to your prospect, to tip the conversion scales. The Smart Content module, can integrate with any data source to help you deliver segmented content based on industry, buyer stage, location or other crucial segments.

    Drupal_SmartContent_srijan
    The module is most effective in conjunction with Smart Content Blocks and Smart Content Segments.

    1. Smart Content Blocks allow you to insert a Smart Block on any page in order to hide/show/swap content within that block, based on the conditions set. They can be added anywhere that traditional content blocks can be placed.
    2. Smart Content Segments allow you to create, save and manage sets of conditions, called segments. Smart Blocks can use any segment(s) to display the corresponding content. For example, conditionally displaying a Smart Block if it's the user’s first time on the site or conditionally displaying a Smart Block to a mobile user.
  3. Acquia Lift: Providing a suite of tools for content personalization, Acquia Lift helps you create contextual digital experiences. It merges content and customer data into one tool, empowering organizations to deliver the most cohesive and personalized experiences across multiple channels and devices.

    Among its other features, Acquia Lift includes content syndication giving organizations the ability to use content from anywhere to personalize across any digital platform, including Drupal and non-Drupal sites.

    Image result for Acquia Lift logoIt has functionalities like drag-and-drop user interface for targeting messages, syndicating content, behavioural targeting, A/B testing, unifying customer profile, and combining anonymous and known online visitor profiles.

    With the ability to target audiences in real-time, marketers can scale their web personalization efforts in order to drive conversions and bottom-line results.

    This gives digital marketers more control over automation, testing and measurement of marketing activities.

Wrapping Up 

At the enterprise level, Drupal has personalization tools and features built right in. So you can show the most relevant message to each of your visitors.

And while setting up personalization can look daunting, Srijan is always at your service to realize your digital business goals. Our work with one leading US media conglomerate and Estee Lauder is a testimony of our customer service and expertise in Drupal. 

Looking to enhance your customer experience and drive more conversions? Speak to our team of experts to explore how to get started. 

May 24 2019
May 24

What makes the Cache API in Drupal 8 any better than Drupal 7's cache system? What's so revolutionary about it? Which of the old limitations does it remove? What are those new concepts and terminology that you should learn about?

And, most of all: how complex is it to set up a cache in Drupal 8 for a specific use case?

You might have already bumped into terms like “max-age”, "context cache" or "cache tags".
 

But how precisely do these new concepts, part of Drupal 8's cache system, refine and streamline the way you cache data on your website?
 

Let's try to demystify the terminology of Drupal 8's Cache API and to translate its new “fancy” terminology into... crystal-clear benefits for you:
 

1. What Is Caching More Precisely? Why Do We Cache Data?

To your “What” question I'd answer:
 

Caching is a... strategy (or layer) for storing data from your website. Or: it's a software or hardware component where you store your data. 
 

Both definitions are equally accurate.

Why would you want to store your data?
 

Because this will streamline the way your website serves all future requests for that cached data.
 

And it goes without saying that reading data straight from the cache takes less time than... retrieving it from a slower data container or fully recreating the result.

In short: caching data translates into faster page load time.


2. Cache API in Drupal 8: The Automatic Cache System

A brief, yet accurate definition of cache in Drupal 8 would be:
 

Storing data that takes too long to load.
 

And if I am to detail it a bit I'd have to add that:
 

Caching can be either permanent or time-limited you'ree to cache any type of data on your website.
 

Now, talking about Drupal 8's cache API, what everyone points out is that: it is much improved. That it's so different from the cache systems of the previous Drupal versions that... you even risk turning your website uncachable if you're not familiar with its new concepts.

“But how different/sophisticated can it be?” you might ask yourself.

Before we delve deep into details let me add just one thing:
 

We're talking about an... automated cache system. Basically, your Drupal 8 website retrieves cache data for both anonymous and logged in users with no configuration whatsoever. All by default...
 

And now, let's shed some light on all these new fancy concepts that the Cache API in Drupal 8 is based on:
 

2.1.The Cache Tags

We all do agree that “invalidating cache” is one of the most challenging tasks of any cache system.

Luckily, not anymore. At least not in Drupal 8, where you now have the concept of “cache tags” that you can use for tagging:
 

  • specific pages
  • specific page elements
  • various types of content
     

… and thus invalidate them all. Improved efficiency and high accuracy through... basic tagging.

Basically, using these cache tags you can easily identify outdated data stored in multiple cache bins and... invalidate it.

This way, you no longer run the risk of invalidating “still green” cache items, in bulk, not knowing which data to invalidate.
 

2.2. The Context Cache

Here's an all too common scenario:
 

You're faced with multiple variants of the same data; only one of them should be cached, based on a specific criterion like language, user, country, content access permission...
 

Well, how do you automate targetting the right variant to be cached? And how do you automate caching the other left variants, as well, depending on the... context.

You use “cache contexts”, that's how...

They're one of those new remarkable features that the Cache API in Drupal 8 ships with, that allow you to specify the criteria to be used for the cached content on a page to vary. By user, by language, by country, by path...
 

2.3. The Max-Age (The Cache Duration)

Maybe you don't want certain data to be forever cached. Maybe you need it stored for a certain period of time only.

In this respect, the “max-age” property in Drupal 8's cache system allows you to define that time limit. To invalidate data that will have run... out of time.
 

2.4. The Bubbleable Cache Metadata

What does this even mean “cache metadata... bubbling”?

Let's take this example: 
 

You have a parent item with its own “family” of... children items. In this context, “bubbled tags” makes it possible for the parent item in this render array to receive cacheability metadata from its children.
 

Bubble cache metadata streamlines the whole process of invalidating... outdated cached data. As simple as that...
 

The END!

Is it any clearer for you now what makes the Cache API in Drupal 8 so... powerful? How its new features come to remove most of the limitations that you've already faced in Drupal 7?

And how you can use them to refine and automate caching on your own Drupal 8 website?

Image by Pexels from Pixabay  

May 22 2019
May 22

There's this millennial phrase "You snooze, you lose" and nowhere is it more applicable than for enterprises today. Opportunities to engage with your audience pop up fast and disappear faster, and you have to act quickly if you wish to leverage any of it. 

You want to build rich online experiences and that's great. But how fast is your team in getting from ideation to roll out? Usually your marketing and digital experience team is brimming with ideas, but the development team is too backed up to work on any of it.

Enter Layout Builder.

Layout Builder is a module in Drupal 8 that became stable with its newest release, Drupal 8.7. It essentially allows content editors and other non-technical stakeholders to design and build custom pages, without waiting for the development team.

Now, all you need to do is download Drupal 8.7 and follow a set of few simple steps and your design is ready.

But was it always as easy as it's now? Let’s take a look at what Drupal offered before.

How It All Started

The Drupal 6 users configured the design by selecting/deselecting the items from the dropdown menu to include/exclude in the website design.

 drupal6-cck-display-fields-srijan-1

 After upgrading to Drupal 7, users managed the fields appearing on the UI in a similar fashion.

drupal7-image-display

With Drupal 8, things remained more or less the same, where developers were the sole owners of the website design.

drupal8-image-display-srijan-technologies

Until Drupal 8.6, the developers could choose templates and include them on the website.

powerful-customization-in-tempaltes-srijan-technologies

Developers could manage how the blocks appeared on the page by selecting the position from the drop-down menus, or, by selecting the options.

block-description-srijan-technologies-1

Developers often used “Panels”, which offered much of the same functionality as Layout Builder. However, in spite of their intuitive GUI and WYSIWYG editor, panels failed when it came to translations.

panels-srijan-technologies

What Went Wrong?

Here’s why the Panels was not a viable solution for long:

  • Difficult to learn
  • No provision to “Preview” the page
  • Could not custom design as per the requirement

Layout Builder - What and Why

As the name implies, the Layout Builder tool enables editors to have an easy-to-use page building experience. So, it’s more convenient if the editor tweaks the design and analyse the suitability of an image with the content, just by dragging and dropping the content.

The tool empowers content authors by leveraging them with the capabilities to:

  • easily adjust the design and format of a page by using drag-and-drop and WYSIWYG tools
  • make changes to the layout without involving developers every time
  • visually create a layout template that will be used for each item of the same content type
  • customize templated layouts on a case per case basis
  • create dynamic one-off custom pages which don’t come under any template like About Us page

For smaller sites where there may not be many pages or content authors, the unrestricted creative freedom seems to be compelling. However, on larger sites, when you have hundreds of pages or dozens of content creators, a templated approach is preferred.

layout builder infographic

Why Else Choose Layout Builder?

Simple Page Management

Layout Builder gives the content editors the capability to create a layout by inserting new blocks from the pop-out sidebar and rearranging them wherever they are needed. They can preview the entire layout instantly, allowing them to insert, replace or delete blocks, images, text and buttons. They can use ‘Content Preview’ checkbox to show small textual representations of the block instead.

Accessibility

With increasing collaboration, there’s a need to ensure that no one is excluded from enjoying the online experience with ease. Layout Builder conforms with the Drupal’s commitment to web accessibility. helps you use keyboard or screen reader to navigate - to conform to the Web Content Accessibility Guidelines recommended by World Wide Web Consortium. Considering the specific accessibility requirements, the drag-and-drop editor was designed to make it accessible for everyone to enable moving blocks, creating new sections and adding/moving content to the blocks.

Workflows

The Layout Builder supports essential activities such as adding, saving, previewing and publishing data. You can send layouts through a staging or approval workflow and then publish it right from the same interface after the team reviews a saved piece.

Templates

The Layout Builder also includes a templating feature, useful for sites with large quantities of content. Using the Layout Template, editors can edit collections of pages all at once and rearrange the structure while retaining the unique content. The ability to restructure multiple pages at once saves a huge amount of time when one block needs to be changed across multiple locations.

How to Work with Layout Builder?

Install the Devel module and enable both the Devel and Devel Generate parts of the plugin.
Click Install.

devel-srijan-technologies

 Source: OSTraining

  • Click Configuration > Generate content in order to generate content for an article. Click Generate.

content-type-srijan-technologies

Source: OSTraining

  • Click Content and you’ll see the generated article.

Configure the Layout of the Article Content Type
Go to Manage > Article and then select the checkbox “Use Layout Builder”. Click “Save”.

configure-the-layout-article-type-srijan-technologies

 

Upgrade to Drupal 8.7 without a doubt!

The newly stable Layout Builder is unique in a way that it supports templated layouts for hundreds of pieces of structured content as well as in designing custom one-off pages with unstructured content. Catch up with the latest upgrade and let your clients make the most of Layout Builder’s features. 

While your editors and authors get empowered to create rich experiences, there are other aspects of your Drupal implementation that could be optimized or transformed with an expert team. Srijan is working with leading global enterprises, leveraging Drupal, data science and analytics, AI, machine learning, and chatbots to create tailor-made business solutions. Let's start the conversation and explore how Srijan can help. 

May 21 2019
May 21

This is the first of a two part series (UPDATE: part two here) discussing a couple of different platforms that we at Acro Media endorse for our clients. First up, I’ll talk about Drupal, a popular open-source content management system, and how it’s excellent content capabilities can be extended using an ecommerce component of your choice. For companies that require experience-led commerce architecture solutions, Drupal as an integration friendly content engine is an ideal open source choice.

A quick introduction

People who follow our blog will already know about open source technology and Drupal because we talked about them a lot. For those of you who don’t know, here’s a quick introduction.

Open Source

Wikipedia sums up open source software well.

Open-source software is a type of computer software in which source code is released under a license in which the copyright holder grants users the rights to study, change, and distribute the software to anyone and for any purpose. Open-source software may be developed in a collaborative public manner. Open-source software is a prominent example of open collaboration.

Open-source software development can bring in diverse perspectives beyond those of a single company. A 2008 report by the Standish Group stated that adoption of open-source software models have resulted in savings of about $60 billion (£48 billion) per year for consumers.

While that describes open source software as a whole, there are many advantages of open source specifically for content creation and ecommerce. No licensing fees brings the total cost of ownership down, businesses are fully in control of their data, and integrations with virtually any other system can be created. If you like, you can read more about the advantages of open source for ecommerce via this ebook.

Drupal

Drupal is a leading open source content management system that is known for being extremely customizable and ideal for creating rich content experiences. In a CMS world dominated by WordPress, Drupal is often overlooked because of its complexity and somewhat steep learning curve. Don’t let that stop you from considering it, however, as this complexity is actually one of Drupal’s greatest strengths and the learning curve is continuously improving through admin-focused UX initiatives.

The platform can literally be made to do anything and it shines when very specialized or unique functionality is required. It has a rich ecosystem of extensions and is very developer friendly, boasting a massive development community ensuring that businesses using Drupal always have support.

On top of this, Drupal has various strategic initiatives that will keep it modern and relevant now and into the future. One of the initiatives is for the platform to be fully API-first, meaning that a primary focus of Drupal is to be integration friendly. Developers can integrate Drupal with any other software that has an API available.

Drupal for experience-led commerce

Drupal is suited for any of the three main architectures (discover your ideal architecture here), but experience-led commerce is where it’s most capable. Experience-led is for businesses who keep the customer experience top of mind. These businesses want more than to just sell products, they want to also tell their story and foster a community around their brand and their customers. They want their customer experiences to be personalized and content rich. It’s these experiences that set them apart from their competitors, and they want the freedom to innovate in whatever way is best for their business.

Click to discover your ideal architecture with our analysis.More often than not, SaaS ecommerce platforms alone just don’t cut it here. This is simply because they’re built for ecommerce, not as an engine for other content. Although there are a lot of benefits to SaaS for ecommerce, businesses using SaaS must conform to the limitations set by the platform and its extensions. Robust content is just not typically possible. Sure, a business may be able to maintain a blog through their SaaS ecommerce platform, but that’s about it.

Drupal, on the other hand, is a content engine first. It was built for content, whatever that content may be. If you can dream it, Drupal can do. On top of this, Drupal, being integration friendly through its API-first initiative, allows businesses the freedom to integrate any compatible SaaS or open source ecommerce platform. At this point, a complete content & commerce solution has been created and the only limitation is your imagination and available resources to implement it. Implementation can be done in-house with an internal IT team or outsourced to one of the many service providers within the Drupal marketplace, Acro Media being one of them.

Let’s look at three widely different examples of Drupal based experience-led commerce.

TELUS Mobility

Website: www.telus.com

TELUS Mobility is one of Canada’s largest telecommunications companies. Imagine the missed opportunities when a customer’s online billing isn’t connected to your latest promotions and customer service can’t quickly or easily get this information in front of them. This was a problem that they faced and business restrictions, one being that they need to own all of their code and data, required that they look outside of the SaaS marketplace for a solution. Drupal, combined with a Drupal-native Drupal Commerce extension, was the solution that they needed. The open source code base of both Drupal and the Commerce extension meant that TELUS Mobility had the control and ownership that they needed. The result was huge, many important customers and customer service UX improvements were made which enabled TELUS Mobility to outperform their competitors.

You can read the full TELUS Mobility case study here.

Bug Out Bag Builder

Website: www.bugoutbagbuilder.com

Bug Out Bag Builder (BOBB) is a content-rich resource centered around preparedness. They generate a lot of different types of content and needed a way to do it that is easy and reusable. They also had a very unique commerce element that needed to tie in seamlessly. Here’s how we did it.

First is the content aspect. BOBB is full of content! They maintain an active blog, continuously write lengthy product reviews and provide their readers with various guides and tutorials. They’re a one-stop-shop for anything preparedness and have a ton of information to share. As you can see, a simple blog wouldn’t be sufficient enough for this business. They needed a way to create various types of content that can be shared and reused in multiple places. The Drupal CMS was easily able to accommodate. All of the content has a specific home within the site, but each article is categorized and searchable. Content can be featured on the homepage with the click of a button. Various blocks throughout the site show visitors the most recent content. Reviews can be attached to products within their online custom bug out bag builder application (more on this below). All of this is great, but what makes Drupal a fantastic content engine is that if BOBB ever needs to use this content in another way, all of the saved data can be reused and repurposed without needing to recreate the content. Just a little configuration and theming work would need to be done.

Second is the commerce aspect. BOBB is not a standard ecommerce store. At their core, they’re actually an Amazon Associate. They’ve developed a trust with their readers by providing fair and honest reviews of preparedness products that are listed on the Amazon marketplace. If a reader then goes and buys the product, BOBB gets a cut since they helped make the sale.

That’s all pretty normal, but what makes BOBB unique is that they also have a web-based Custom Bag Builder application. This tool has a number of pre-built “BOBB recommended” bag configurations for certain situations. Customers can select these bags (or start from scratch), view/add/remove any of the products, and finally complete the purchase. Since BOBB doesn’t need the full capabilities of ecommerce, it didn’t make sense for them to be paying monthly licensing fees. Drupal Commerce was selected for this purpose. It’s used as a catalog for holding the product information and creating a cart. Then, an integration between Drupal Commerce and Amazon transfers the cart information to Amazon where the customer ultimately goes through checkout. Amazon then handles all of the fulfillment and BOBB gets the commission.

BikeHike Adventures

Website: www.bikehike.com

BikeHike Adventures was founded as a way of bringing like-minded adventurers together through the unique style of world travel that they promote – activity, culture and experience. They provide curated travel packages that customers enquire about through the BikeHike Adventure website. Travel is all about experience and they needed to share this experience through their website. They also needed more than just a standard article page to do it since there is a ton of information to share about each package. Furthermore, they wanted to give customers a way to reserve a trip for pre-selected dates or through a custom trip planner. Again, Drupal was a perfect fit.

When you visit the site, you’re immediately thrown into the world of active travel through a rich video banner followed by a series of travel packages, a travel blog and more. There is a lot of exciting locations and vibrant imagery throughout.

Clicking into a package, you’re again hit with spectacular photography and all of the information you would need to make a decision. You can read about the trip, view the itinerary and locations marked on a map, learn about what’s included and where you’ll be staying, read interesting and useful facts about the country and location, see a breakdown of day-to-day activities, read previous traveler review, and more. When a customer is ready to book, they can submit an enquiry which is then handed off to the BikeHike Adventures travel agents.

A commerce component isn’t actually being used in this site, but it’s just a great example of content and customer experience that is used to facilitate a booking with a travel agent. If BikeHike Adventures wanted to in the future, they are free to integrate the booking and payment platforms of their choice to automate some, if not all, of that aspect of this process. By utilizing the open source Drupal CMS, this is an option that they can exercise at any point in time.

Who is Drupal best suited for?

Drupal could be used for any business, but it’s typically best suited for ecommerce businesses:

  • Who want to differentiate their brand through personalized shopping experiences
  • Who want to showcase products outside of a standard product page
  • Who want the power to develop a content-rich experience AND have an industry standard checkout process
  • Who want to sell across multiple channels and third-party marketplaces
  • Who need to develop and execute cohesive and synchronized marketing campaigns across multiple channels
  • Who want the freedom to integrate and connect their CMS and commerce platform with other components within their overall architecture
  • Who want to limit platform fees and instead invest in their own commerce infrastructure

In closing, there’s a reason why the ecommerce market is open to open source more than ever. Businesses are increasingly seeing that open source provides a quality foundation for which to build and integrate the solutions they need for today's new-age ecommerce. Customer experience is now seen as a competitive advantage and there are a handful of options that can provide this experience, Drupal being one of them. If you’re looking experience-led ecommerce solutions, consider Drupal. It might just be what you need.

UPDATE: Read part 2 of this series - BigCommerce & Drupal for Growing Ecommerce Businesses

Additional resources

If you liked this article, check out these related resources.

Click to discover your ideal architecture with our analysis.

May 21 2019
May 21

To keep up with consumer demand, businesses need to tactically rethink and reform the way they produce and manage content. 

What you need is a way to stand out in the consistent content chaos. To make that happen, you need a strategy that can help:

  • push out content intuitively
  • transform disorganized assets into a comprehensive manner
  • manage real-time collaboration effectively

And that’s where the role of a CMS is important.

Here’s a comprehensive guide to building the right content strategy with Drupal, focusing primarily on the technological aspect, which will help you build and establish the right notes with your audience.

You Need to Have a Content Strategy. But Why?

With an increase in the number of content dissemination channels, it is easy to lose consistency and easier to lose track of the larger goal.

“Pushing out content without being focused on the goal, its relevance, distribution, or the target audience is a waste of time and money – even if your content is amazing!”

The 2018 Demand Gen Report revealed that buyers are becoming more discerning and selective in the content they decide to consume. 88% agree that content producers need to focus less on product specifics and more on the value that can be brought to their business.

Infographic with three hexagons and text on it on a blue background

These key findings from the audience can be harnessed only with a well-designed content strategy. Which means by doing as little as creating a persona you get ahead of 58% of your competition (2018, CMI Report).

According to the same study, a whopping 97% of top performing B2B marketers have a content marketing strategy, while 32% of (overall) B2B marketers do not have a documented plan. In most cases, this means that they really have no clue what they’re doing.

Some of the benefits of a digital content strategy are:

  • Aligns your team with the organization’s mission/goals
  • Helps you figure out which types of content to develop and which will work
  • Keeps your team focused on priorities
  • Helps you allocate resources for better results
  • Clarifies your target audience/s

Building Content Strategy With Drupal

Traditionally, the content strategy involves planning, creation, and governance of content. However, with an explosion of channels and proliferation of new devices, content strategy can not be limited to just website content.

One of the challenges is to remain engaging yet relevant on different channels.

This can be solved by bringing uniformity and consistency across the various touch points from which a user can access information and engage with the content.

“The goal of the content strategy must be to strategically fit the reader into the marketing funnel”

Drupal’s dynamic features at the core make it a perfect fit to cater to the needs of creating great digital experiences. Here’s how:

Unifying the Content Strategy Across Channels with Drupal

Content Governance

Often neglected, content governance is a detailed framework of content delivery and management which ensures consistent brand storytelling across all media.

Implementing a content governance framework requires different users (from the same or different teams) to collaborate with a distinct workflow and audit trail effectively. In the face of exponential growth in the variety and volume of content,  Drupal helps manage, organize, and secure the content with Workflow and Staging. 

Since editing the content on live site can also result in accidental publishing, Drupal’s Workflow module provides a separate staging environment . Drupal has an easy staging and preview of content in different environments anchoring full content staging capabilities.

You can define multiple workspaces such as "staging" and "live" which are copies of your site, to create content (or modify) and the changes are visible only within that workspace. Once the changes have been verified, you can "deploy" the content to another workspace.

User, roles, and permission: Security is important and that is why not every user can have permission to access the system of the website. Drupal offers a number of security modules which help manage and secure backend access. 

With User Access Control, site administrators on Drupal can work to provide unique user experiences and different access rights to writers, editors, marketers, and site visitors.

The Workflow module helps in creating arbitrary workflows and assigning them to entities. That's  important from a security perspective too. Workflow with the states like Draft, Review and Published can be assigned to Story node type.

Thus, only the users with ‘Editor’ permissions can set stories to the published state.

Some of the other Drupal modules which can be used are:

  • Workbench Access module: helps in creating editorial access control. Admin can grant access to the users and their content which can be found at My Workbench on Homepage. It harnesses content-focused features in one unified user interface.
  • Domain Access module: allows you to share users, content, and configurations across a group of sites.

Enterprise-wide password control systems

Password security is even more crucial and needs the right kind of strategic perspective with strong policies.Default password management could be considered good, but of course, it can be improved. Here’re some of the Drupal security modules that can be used to provide additional controls for password management:

  1. Password Strength: provides realistic password strength measurement and server-side enforcement for Drupal sites using pattern-matching and entropy calculation.
  2. Password Policy: provides a way to enforce constraints which must be met before a user password change will be accepted.
  3. Restrict Password Change: Adds a new permission 'change other users password'. When the user_profile_form is loaded it checks to see if the current user has the proper permission or if they are editing their own account, otherwise, it removes the password change option.
  4. Login Security: Login Security module improves the security options in the login operation of a Drupal site. By default, Drupal introduces only basic access control denying IP access to the full content of the site.
  5. Shibboleth Authentication: Provides user authentication as well as some authorisation features.
  6. Flood Control: Add an administration interface for hidden flood control variables in Drupal 7, like the login attempt limiters and future hidden variables.
  7. Secure Login: Ensures that the user login and other forms are submitted securely via HTTPS, thus preventing passwords and other private user data from being transmitted in the clear.

Digital Asset Management System: An important part of the governance is business workflow and common identity, which is significant for the smooth functioning of marketing. The CMS needs to provide the ability as a solid repository while also able to modify uploaded digital assets.

It should give editors the ability to make iterative changes to assets to enable promotion of products and brand across channels and devices. Digital Asset Management (DAM) smartly strategizes the way enterprises handle their digital assets.

The Acquia DAM Connector can sync your digital assets with your Drupal website, allowing editors to seamlessly use content from within all the websites you maintain. In order to ensure that the site is using the latest version of an asset stored, it periodically syncs assets from Acquia DAM via a cron job.

It also empowers editors to select Acquia DAM assets directly through a media field or through the WYSIWYG integration. Further, it enables the user to view asset metadata directly in the entity browser without importing the asset and provides a usage report of assets within Drupal.

“In the digital landscape, the creation of digital assets in large numbers is almost inevitable.”

Backup: Writing content is an intensive exercise. And so you need to have a backup to save yourself in case the website system crashes or is hacked.

Backup and Migrate: Back up and restore your Drupal MySQL database, code, and files or migrate a site between environments. Backup and Migrate supports gzip, bzip and zip compression as well as automatic scheduled backups.

Content Modelling with Drupal

Before you start building the site it is important to consider your content as a whole and work out a model that will guide you and the user to smoothly navigate through the website.

It entails detailed definitions of each content type’s elements and their relationships to each other. It also helps to identify the organization’s requirements, develop relevant taxonomy that meets those requirements, and consider where the content blocks and fields should be allowed or required. 

Content modelling is a critical starting point for website content.

Drupal is an incredible CMS for building a content-rich website. Built on its entity system and the variety of field types, Drupal can support a wide range of content models.

At core, it is built on View which can help sort out the default taxonomy/term view however you want. Let’s you want a way to display a block with the X most recent posts of some particular type.

It can be used for anything that handles the display of views, and the core Views UI module permits you to create and edit them in the administrative interface. When you define views, you are interested in taking data from your website and displaying it to the user.

Breaking content types into fields, it allows you to build structured content as well.

Modules like Paragraphs and Stacks let you build rich and dynamic content.

Layout Builder, a stabilized module, in Drupal 8.7, empowers you to build layouts with ready-to-use multi-column layouts and Drupal blocks without the intervention of a developer.

It is unique since it can support multiple and different use cases from templated layouts applied to dozens of pieces of structured content, to designing custom one-off pages with unstructured content.

Here’s how it can be used in three different use cases:

  1. Layouts for templated content: The creation of ‘layout templates’ can be used for a specific content type. Example, blog posts.
  2. Customizations to templated layouts: Can customize the layout templates on a case-by-case basis. Example, to override the layout of a standardized product page.
  3. Custom pages: The creation of custom landing pages which are not in sync to any particular content type or structured content. Example, a single ‘About us’ page.

The Layout Builder is more powerful when used with Drupal's other out-of-the-box features such as revisioning, content moderation, and translations.

Omnichannel Content Strategy with Drupal

Users are always at the centre. Therefore, the content strategy needs to be as dynamic as your user experiences across different channels, if it is to succeed. Omnichannel content strategy is a way to unify the experience across all the channels and touchpoints.

Irrespective of how and where the content/ products are being first consumed at, complete consistency and unified experience is expected.

API First Publishing with Drupal

Drupal 8 is API-first which means, it can power ambitious applications of all kinds, from behind-the-scenes systems written in languages like Python, Java or Go to rendered experiences using the latest frontend frameworks, like React, Vue and Ember.

Content touchpoints are proliferating at a fast clip. You now have conversational UI, digital signage, medical and healthcare devices, and it lets you integrate with other systems, use your content anywhere, display it as you please. API-First Drupal is well positioned for entire digital ecosystems.

[embedded content]

The JSON:API module, which is also now in core with Drupal 8.7, is meant for creating high-performance APIs to expose Drupal data in JSON. It works by creating API endpoints and requires no configuration and the module instantly accesses all Drupal entities.

It not only provides a great authoring experience but also a powerful, standards-compliant, web service API to pull that content into JavaScript applications, digital kiosks, chatbots, voice assistants and more.

This makes it easier for Drupal’s core ecosystem, of web services responsible for third-party content and application, to integrate.

Mobile-first and Out of the Box Responsive

Accessibility via any device needs to be useable too. Drupal 8 has been designed with a mobile-first strategy. The responsive design ensures that content and layout are scaled based on the viewport size available.

With  Breakpoint and Responsive Image, out-of-the-box Drupal 8 ships with two modules that ensure mobile-first behaviour .

Responsive content needs to be modular and readable so readers can easily consume it.

Drupal for mobile lets you easily define different pieces of content for different devices. Each field in the backend can be uniquely styled and prioritized according to its content type.

Personalization with Drupal

No matter how good your content is, no one will bother to read it if it doesn’t talk to them, in their own language. Every content piece needs to communicate with your audience and increase the relevance of product proposition, by addressing their unique fears, needs and desires.

This orchestrates customer experience and drive engagement.

Personalization brings familiarity, which brings strength to customer loyalty to your brand, helps track demographics and behavioural patterns and convert an anonymous user into a potential customer.

Acquia Lift solves the challenges for digital teams, by bringing together content and user profile data from any source to personalize the customer journey in ways not previously possible. More than a headline swap or banner choice, Lift presents wholly targeted experiences based on broadly observed visitor behaviors as well as specific user preferences and interactions in real time with the very first engagement across any device or channel.

“And 81% of B2B Marketers (2018, CMI Report) believe that building a content strategy makes it easier to determine which types of content to develop.”

Drupal in Other Marketing Technology

New technologies like artificial intelligence (AI), machine learning, Augmented Reality (AR), Virtual Reality (VR) among others are reshaping how users consume content. It’s a big opportunity for companies to produce and recycle the same content through different channels and mediums. All the while keeping people engaged.

Virtual Reality

Immersive experiences created by virtual reality is the “Next Big Thing” happening. Virtual reality has seen a surge lately, with constantly emerging in Gartner Hype Cycle. While it is rapidly approaching a much more mature stage, in the enterprise sector, virtual reality has already lots of scenarios where it gets employed with success.

For instance, educational purposes. VR can enable a lot of more experiences that in reality are not possible or too dangerous.

Here’s a demo video of a high school student, Jordan who explores Massachusetts State University (a fictional university, built on Drupal) from the comfort of his couch. Jordan is able to take a virtual tour directly from the university's website.

[embedded content]

 
Augmented Reality

Another part of the futuristic technology, AR can be used to superimpose useful information in a shopping experience.

[embedded content]


The demonstration shown in this video displayed a shopper interacting with the AR application. The mobile application of Freshland Market (a fictional grocery store), built on Drupal 8, guided the shopper through her shopping list.

Wrapping Up

Often, it can be a virtual nightmare for content producers and marketers trying to find the right piece at the right time. Even so, if the content is all in one place, time-consuming complicated systems can mess up really bad.

Drupal 8 provides a perfect foundation for the incorporation of technologies to enable a smart strategy for your brand, content, and digital marketing needs. Your organization might be at infancy or already up with your content strategy, you can always reach out to our experts who can help you deliver quality results with personalized experiences.

May 17 2019
May 17

At DrupalCon Seattle this year, Mediacurrent was excited to unveil our latest distribution and Gatsby integration. Rain is a group of prepackaged, pre-configured components vetted by our development team and sourced from the open source community.

Our goal it to help web teams create, configure, and deploy websites faster. This tutorial will show you exactly how to get up and running end-to-end. You can also follow along with our tutorial videos

Step-by-step guide to get started with Rain, Gatsby, and Netlify 

  • Installing the Rain distribution
  • Enable JSON:API
  • Hosting integration
  • Setup Gatsby
  • Configure Netlify
  • Connect Drupal 8 to Netlify

Step 1 - Installing the Rain distribution

[embedded content]

There are many ways to spin up a new Drupal 8 instance. In this tutorial we will use Mediacurrent’s open source Drupal project template which is available for download on Bitbucket. This repository includes everything you will need to get up and running including VM, Guardr security integration, the Rain install profile and more.

First you will want to create a repository wherever you typically host your Git projects (i.e. Github, Bitbucket or Gitlab). Once you have that setup you can clone Mediacurrent’s repo and point the origin back to your Git repo.

Example:

git remote set-url origin [email protected]:mediacurrent/shortcode_project.git

Next you will want to initialize the project. You can do that by running the following commands with your local host name and IP.

Example:

composer install
composer drupal-scaffold
./scripts/hobson project:init example.mcdev 192.168.50.4

Finally, to build the project and run the install you can simply run “./scripts/build.sh” which runs composer install as well as the Drupal install. Note that the project README has more detailed instructions but this will give you an idea how to get up and running quickly.

Once you have completed your install you will want to push updates to your git origin.

Step 2 - Enable JSON:API

[embedded content]

In order to make our Drupal 8 site provide data to the Gatsby frontend we will enable the JSON:API module added to core in version 8.7. For now the Gatsby JSON:API source plugin is the most well-supported way to ingest content from Drupal but eventually a GraphQL module-based source plugin will replace the need for JSON:API.

Mediacurrent has a Packagist feature module that makes this process a little bit easier because it will also add some test content we need to get Gatsby running out of the box. Otherwise, you would have to manually create any paragraph being used in our Gatsby starter.

To add the Rain Gatsby feature simply run the following command:

composer require mediacurrent/rain_gatsby

After the Rain Gatsby feature is downloaded you will enable the feature which in turn enables JSON:API and creates 1 test page with paragraphs. When you have completed this step, be sure to export your configuration and push any file updates to origin.

Step 3 - Hosting integration

[embedded content]

Most Drupal web hosts (e.g Acquia, Pantheon, etc.) have their own git repository they use for deploying artifacts to the server. This includes all  the actual Drupal files that make up core, contributed modules and libraries. We don’t want our source git repository to store artifacts or conform to the folder layout required by the web host. Instead, we execute deploy commands to build the artifacts from Composer and commit them to the appropriate destination git repository. To make that process easier we have some additional configuration to add to our config.yml file that instructs how and where code should be deployed.

The key aspects to both the Acquia and Pantheon configuration is pointing the release repo to the appropriate git URL provided by your host, the name of the host and the release drupal root directory. Our examples use Acquia and Pantheon but also support generic git artifact repositories like AWS.

Acquia config:

project_repo: [email protected]
release_repo: [email protected]:mcABCProject.git
release_drupal_root: docroot
deploy_host: Acquia

Pantheon config:

project_repo: [email protected]
release_repo: ssh://codeserver.dev.YOUR_UUID_VALUES.drush.in:2222/~/repository.git
release_drupal_root: web
deploy_host: Pantheon

Additionally for Pantheon you will need to add a pantheon.yml file to the root directory with the following values:

api_version: 1
web_docroot: true
php_version: 7.1 (or latest PHP version supported)

This command also needs to be run in order to clean up the Pantheon git repo prior to our first deployment:

rm -r README.txt autoload.php core example.gitignore index.php modules profiles robots.txt sites themes update.php vendor web.config

Now we are ready to build and deploy for the first time. We do this with two commands, one to build the artifacts and one to push files to the release git repository.

Example (using Pantheon):

./scripts/hobson release:build Pantheon develop
./scripts/hobson release:deploy Pantheon develop -y

After you have deployed code to Acquia or Pantheon you should be able to run a clean install using either the sample Rain child install profile (mis_profile) or cloned profile you have created (see Rain README for more details).

Step 4 - Setup Gatsby

[embedded content]

To connect your Drupal instance to Gatsby, at a minimum you just need the Gatsby source plugin pointed to Drupal’s JSON:API endpoint. For those new to Gatsby, it can be a lot of work to map your components to Drupal content using GraphQL.

In order to make this whole process quicker and easier, Mediacurrent created a Gatsby starter (available at https://bitbucket.org/mediacurrent/mis_gatsby_rain/src/develop/) that does a lot of the initial component development for you. Our Gatsby starter includes React components with GraphQL that maps to the Paragraphs data incoming from the Rain install profile. Any time you change a Paragraph you will need to adjust your components and GraphQL but it’s much easier than building everything from scratch. The components also include basic markup, styles and in some cases Javascript to give developers something working right out of the box.

Spinning up the Gatsby + Rain starter is very simple, and uses the same syntax as other Gatsby starters. See the example below:

gatsby new my-rain-starter https://bitbucket.org/mediacurrent/mis_gatsby_rain

In the next step, we will point Gatsby to the appropriate JSON:API feed coming from our Drupal environment. Since this value will change per environment we have already created a variable named “BASE_URL” in our gatsby-config.js file. To set this value, you simply add BASE_URL to a .env variable in your docroot. Important: remember to include the trailing slash and you do not need to add “/jsonapi” to the path. See below:

BASE_URL=http://myproject.mcdev/

To test simply run the following commands (note that this assumes you have NVM installed):

nvm use
nvm install
npm install
npm run develop

If you are able to run without error you are in good shape! Remember to commit any updates made but you will want your local “.env” file ignored.

Step 5 - Configure Netlify

[embedded content]

Now that we have Rain and Gatsby connected locally we will want to prepare our static host. There are many options available, but we like Netlify because it’s free and easy to set up.

Once you sign up for a free account you will have an option to create a new site. You should see a similar screen as below.

config netlify

Mediacurrent uses Bitbucket for our git repositories but you can connect to any of the popular Git hosts from this screen. You will want to make sure to select the git repo you set up earlier that contains all of your Gatsby files. When you get to the last step you need to add two additional configuration settings.

additional config settings

For build command you will add “npm run build” and in the next box you will add “public” as your publish directory. This tells Netlify how to build Gatsby and where your public docroot lives.

Finally, we need to set up our “BASE_URL” variable in Netlify to point to our public Drupal instance. To do this we will add a netlify.toml file to our Gatsby repo with our host name.

Example netlify.toml:

[context.production.environment]

  BASE_URL = "http://pathtodrupalsite.com/"

We need to tell Netlify to look for BASE_URL in this value so we will configure that in the “Environment” area on the project settings page. See below:

Netlify environment

To give it a whirl, go to “Deploys” and manually trigger a deployment. You will see in the console log whether it was able to read in JSON from your Drupal 8 site. Note: a good option to add some additional security is to add an htaccess password to your Drupal site and make sure that you are accessing that JSON endpoint over https.

Step 6. Connect Drupal 8 to Netlify

[embedded content]

By this point we have everything spun up connected but Netlify only builds when we manually trigger a build. In this step, we will point Drupal 8 directly to Netlify so that we can programmatically tell Netlify when to build. This is accomplished with the “Build Hooks” module.

The Build Hooks module is very flexible and can point to any environment which has a URL that triggers a Gatsby build. For Netlify we will be using the build_hooks_netlify submodule that provides direct access to Netlify using their API.

To enable API access we need to create a personal access token from your account. This is found under User Settings, Applications underneath the “Personal access tokens” area of the page. After clicking the “New access token” button you will see the following screen:

create new personal access token

All you need to do is name your token and you will be presented with the token value that the Build Hooks module needs to connect to Netlify.

Next we need to create a build hook trigger that is set up underneath the “Build & deploy” settings for your application. This is the URL that we are going to ping from Drupal in order to tell Netlify when to rebuild.

build hook trigger

Now let’s hop on over to our Drupal site and get things set up there. After adding and enabling the build hooks module (“composer require drupal/build_hooks”) and Netlify submodule you will be ready to configure the Netlify settings. This is where you will plug in the personal access token just created (see below):

build hook netlify setting

Once we do that we still need to set up the Build hooks environment. We will add a Frontend environment using the “Netlfy” environment type in the Build Hooks configuration.

From there we need to supply a few settings including the frontend URL, Build hook URL, API id and Git branch. The API ID value is found on the main “Site details” page for your Netlify app (see screenshot below).

site details

The interesting thing about the Build hooks module is that we have options for how we want to trigger Netlify’s build. We can manually trigger a build from Drupal 8 clicking a button, or we can auto-trigger builds every time content is saved or after cron runs. For our purposes we can select “When content is updated” but the beauty here is that you could set up a test environment that auto-builds while only updating production when manually triggered. That is the power of Gatsby + Drupal!

One additional step is we can prevent the auto-save setting locally by adding one line of configuration to our local settings.php. This effectively overrides that auto-save trigger. For that you will want to add the following line:

$config['build_hooks.settings']['logging']['entity_types']['node'] = 0;

Wrap-up - Final Testing

The last thing we need to test is to make sure that saving a piece of content in our Drupal host will trigger a new build in Netlify. To do that we click on any sample node on our test site with a small change such as an updated title. The first thing you should see is a message indicating that a change has been pushed to your Frontend environment. If that works we will want to check our Netlify “Deploys” tab to see if the build has been triggered successfully. If you run into any issues, you will want to double check your configuration and Drupal logs for errors.

Still having trouble? For Rain specific issues, please create a ticket in our project issue queue on Drupal.org. For Gatsby related questions or problems, we have an issue set up on our Gatsby + Rain starter repository

May 16 2019
May 16

“..an inclusive community, we are committed to making sure that Drupal is an accessible tool for building websites that can also be accessed by people with disabilities.”

Calling accessibility as one of Drupal's core values and principles, the Drupal community has always stood to comply with web accessibility standards. Although with an absence of hard and fast rules to adhere to, the community has faced backlash in recent times.

First, with adopting Gutenberg (editor) and second with the release of Layout Builder, there have been some important questions and concerns about accessibility in the community.

This Global Accessibility Awareness Day, an awareness day to focus on digital access and inclusion for the more than one billion people with disabilities and impairments, let's take a look at how close is Drupal to its commitment towards web accessibility.

The Accessibility Controversy

a black and white design with G written in centreIn 2018, with WordPress 5.0 prepared to be released, the Gutenberg editor, a decoupled React based editing experience, was out for testing. Among other concerns like inconsistent user interface behaviour, difficulties with keyboard navigation through blocks ( far too heavily reliant on hover-based functionality), complexity to use it, the assessors were quick to call it inaccessible.

Drupal’s adoption of Gutenberg, got it in the fallout.

In another instance, when Drupal 8.5 released Layout Builder, the lack of accessibility in the feature brought the community into the topic of debate - how strongly does Drupal commit to accessibility?

How Does Drupal Ensure Web Accessibility?

Accessibility is about promoting inclusion than benefitting a small set of people with disabilities. It is about ensuring equal and inclusive access to the web resources, for the widest possible audience, without any bias.

And this has been reiterated in the Web Content Accessibility Guidelines (WCAG), that explains how web content can be made more accessible to people.

Drupal, in its Values and Principles, effectively lays down their commitment towards creating software which conforms to the accessibility guidelines. It conforms to the World Wide Web Consortium (W3C) guidelines which address:

  • Authoring tools, as part of the Authoring Tool Accessibility Guidelines (ATAG 2.0)
  • Web content, as part of the Web Content Accessibility Guidelines (WCAG 2.0)

As a result, it can be used both by developers as well as the site visitors.

Drupal has its own accessibility team, which helps identify the barriers occurring at the code level and the awareness level, and also resolves them. A number of such issues in the core have been identified and resolved, while also creating awareness within the community.

Some of these improvements included: Search engine form and presentation, drag and drop, color contrast, image handling, form labelling and so on.

Accessibility for developers is another added feature in Drupal, and through D7AX, it is an easy job to find contributed modules and themes which also support the development of accessible websites.

Let’s take a deeper dive into the key modules and features of Drupal that help overcome web compatibility issues, and ensure easier web accessibility:

Key Modules

Automatic Alt text It automatically generates an alternative text for images when no alt text has been provided by the user.  Block ARIA Landmark Roles  It adds additional elements to the block configuration forms that allow users to assign an ARIA landmark role to a block.  CKEditor Abbreviation  It adds a button to CKEditor which helps in inserting and editing abbreviations in a given text.  CKEditor Accessibility Checker  It enables the Accessibility Checker plugin in your WYSIWYG editor, which then helps inspect the content accessibility level; and solve them.  High Contrast  It allows the user to quickly switch between the active theme and a high contrast version of it.  htmLawed  It utilizes the htmLawed PHP library to limit and filter HTML for consistency with site administrator policy and standards and for security.  Style Switcher  Themers can provide a theme with alternate stylesheets. Allowing special styling for some part of the site, the module presents all those styles as a block with links. So any site user is able to choose the style of the site he/she prefers.  Text Resize  It provides the end-users with a block for changing the font size of text on your Drupal site.  Accessibility  It gives a list of available Accessibility tests, aligned to guidelines like WCAG 2.0 or Section 508.


Key Features:

  1. Semantics in the Core

Drupal has been built to encourage and support the proper use of semantic markup. Thus composing semantically correct HTML informs the browser and the assistive technology about the type of content it is managing with, and how this relates to other content.

This helps the assistive technologies carry out its activity effortlessly since they now have a structure to work with.

 2. Aural Alerts

Drupal provides a method called “Drupal.announce()” which helps make page updates obvious, in a non-visual manner. This method creates an aria-live element on the page.

 3. Controlled Tab Order

Drupal’s TabbingManager is an awesome medium to direct both non-visual and non-mouse users on the page, to access the prime elements in a logical order. And thus permits more control while exploring complex UIs.

 4. Accessible Inline Form Errors

Drupal forms are now more open to the expansion of available inline form errors. So now, it is easier for everyone to identify what errors made while filling in a web form.

 5. Fieldsets

Fieldset labels are utilized as systems for gathering related segments of forms. When effectively implemented, these labels give visual diagrams around the shape field gathering.

Presently, Drupal uses fieldsets for radios & checkboxes in the Form API. This helps towards additionally upgrading forms in Drupal.

What was the Outcome of the Controversy?

As always, the community has stood by accessibility as one of the core tenets. In a blog, Drupal's commitment to accessibility, Dries Buytaert - Drupal Founder - writes on the issue and how seriously the community takes the commitment to accessibility.

With that said, he announced that the Layout Builder functionality would be in a "stable" state for production use after ensuring that it passes the accessibility gate (Level AA conformance with WCAG and ATAG). This holds for both the authoring tool itself, as well as the markup that it generates.

With accessibility maintaining team, it has been jointly agreed that:

  • The first priority is WCAG 2.0 AA conformance. This means that in order to be released as a stable system, the Layout Builder must reach Level AA conformance with WCAG. Without WCAG 2.0 AA conformance, a stable version of Layout Builder won’t be released. This happened with a stable release of Layout Builder in 8.7.
  • The next priority is WCAG 2.1 AA conformance. Because these guidelines are still new (formally approved in June 2018), the stable version of Layout Builder won’t be held on them but are committed to implementing them as quickly as possible, even if some of the items are after the initial release.
  • While WCAG AAA conformance is not something currently being pursued, there are aspects of AAA that we are discussing adopting in the future. For example, the new 2.1 AAA "Animations from Interactions", which can be framed as an achievable design constraint: anywhere an animation is used, it will be ensured that the designs are understandable/operable for those who cannot or choose not to use animations.

The commitment to this ideal, by the leadership at Drupal and by the larger community, has remained steadfast despite challenges. The announcement and commitment to conform to AA level has reinstated the faith in the community towards its values.  

Ready to build digital experiences that are truly great for your customers - frictionless, accessible, and inclusive? Drop us a line, and our Drupal experts will be in touch.

Pages

About Drupal Sun

Drupal Sun is an Evolving Web project. It allows you to:

  • Do full-text search on all the articles in Drupal Planet (thanks to Apache Solr)
  • Facet based on tags, author, or feed
  • Flip through articles quickly (with j/k or arrow keys) to find what you're interested in
  • View the entire article text inline, or in the context of the site where it was created

See the blog post at Evolving Web

Evolving Web