Drupal News

Agiledrop.com Blog: AGILEDROP: DrupalCon sessions about Business

  • Last time, we gathered together DrupalCon Baltimore sessions about PHP. Before that, we explored the area of DevOps, Front End, Site Building, Drupal Showcase, Coding and Development, Project Management and Case Studies. And that was not our last stop. We have two to go. This time, we looked at sessions that were presented in the area of Business. Beyond the .Com: Drupal's new role in the Large Enterprise by Josh Linard from Mediacurrent This session was not about Gartner rankings and CMS comparisons, but it was about attendees gaining an understanding of how Drupal now fits into a global… READ MORE

    2 days 3 hours ago

Vardot: AMP Up Your Drupal Site Using Google's Accelerated Mobile Pages

  • How to Read time: 11 minutes Background

    Accelerated Mobile Pages (AMP) is a web mobile technology specifically designed to tackle unresponsive web pages on mobile devices like smartphones and tablets. The challenge of poor mobile user experience due to slow loading of web pages is not new. Rich media contents, including ads, often in the form of videos, images, and audios, have made the web unbearable for mobile users. So much so that, as early as 2010, Google designated the load speed of a website as a rank factor in its search algorithm. In 2014, Google added the mobile usability report to its Webmaster Tools. Running this new report identifies specific mobile usability issues on a given website as detected by Google. With the availability of this reporting tool, it was generally speculated that mobile usability would one day become a ranking factor. Speculation turned into reality in 2015 when Google announced that mobile usability is officially a rank factor in its search. Despite earlier signs and warnings from Google, this event still created quite a shock among webmasters, and was nicknamed Mobilegeddon for its magnitude of impact. In a nutshell, if a web page is deemed mobile-unfriendly by Google, (and there is no middle ground), it will be ranked lower even if its content is exceptional.

    The case for mobile pages with fast load times makes business sense, and is backed by industry research statistics. About half of Internet shoppers expect a web page to load within 2 seconds. Furthermore, studies showed that 40% of desktop users would abandon a slow loading web page, while mobile users were abandoning at even a higher rate (50%), according to Consumers in the Micro-Moment, May 2015.

    As a direct response to the mobile web speed challenge, Google introduced the AMP project in 2015. Gary Illyes, webmaster trends analyst at Google, reported that AMP web pages load 4 times faster than the average. Jon Parise, technical architecture lead at Pinterest, cited test results that show AMP pages use eight times less data than traditional mobile-optimized pages. Better user experience with AMP pages correlates with improved user engagement: 90% of publishers net higher CTR, while 80% of publishers are getting more page views.


    Technology overview

    In a nutshell, AMP leverages existing web technologies, and can be readily deployed on existing web infrastructure. Specifically, AMP pages can be uploaded to and served from existing web servers without custom server configuration.

    AMP pages are built using AMP HTML and AMP JavaScript. AMP HTML is a subset of HTML 5 and is styled in-line by CSS 3. The design of AMP is guided by the principle that features that may hinder fast page loading are banned. Not all HTML tags are supported by AMP, e.g., frame and frameset are prohibited. In addition, some HTML 5 media tags (such as img, video, audio) are replaced by the corresponding AMP HTML tags (amp-img, amp-video, and amp-audio). The loading of AMP pages is managed and optimized using the AMP Javascript library. This JS library enforces the performance-enhancing best practices for page rendering. To further improve page loading performance, AMP pages can be cached on network proxy systems such as the Google AMP Cache.


    Web applications

    Although AMP, as a technology, is only 2 years old, it has been deployed successfully with well-documented case studies from web publishers, advertisers, and e-commerce websites.

    It is no surprise that, because of its origin as a Google initiative, AMP pages are featured prominently in Google Search results. AMP-enabled news stories are displayed in the AMP carousel at the top of mobile search results pages. Although AMP is not yet ubiquitous in the mobile web, it is gaining traction by being supported on LinkedIn, Medium, Pinterest, Reddit, Twitter, WordPress, and Drupal.

    Drupal is a CMS that many web publishers and e-commerce vendors use to build their websites (learn here why). If you are a Drupal developer, AMP is a technology that you should definitely consider using. To make AMP adoption easier, Drupal has developed an AMP module to automatically convert regular pages into AMP pages. The rest of this article shows how to enable AMP support in the Drupal environment.


    Install Drupal AMP support Overview

    AMP support on Drupal requires the installation of the following components.


    1. AMP module
      The AMP module manages the conversion of regular Drupal HTML pages to AMP-complaint pages. The URL of AMP pages ends with the string '?amp'.

    2. AMP PHP library
      The AMP PHP library is the engine behind HTML conversion. It validates user-entered HTML against the AMP standard, and makes the necessary corrections to ensure compliance.

    3. AMP theme
      The AMP theme consists of the AMP base theme and the ExAMPle sub-theme. All Drupal AMP pages must be displayed using a sub-theme of the AMP base theme. You can create a new AMP sub-theme from scratch, or modify the default ExAMPle sub-theme.


    Both Drupal 7 and Drupal 8 support AMP. The following illustrates how to setup AMP support for Drupal 8 on the Linux platform.


    Install procedure

    The prerequisite is that a working Drupal system is already in place. The following install procedure uses the command-line tools Composer and Drush. If these tools were already installed on the Drupal system, they do not need to be re-installed. Unless specified otherwise, the following steps should be performed using a non-root account on a Linux system.


    Download and install Composer

    Composer is the dependency manager for downloading PHP packages. Download and install Composer using this command:

    curl -sS https://getcomposer.org/installer | php

    Move the installed program to a system directory that grants you execute permission, e.g., /usr/local/bin.

    mv composer.phar /usr/local/bin/composer


    Download AMP module

    Download the AMP module and its dependencies, including the AMP PHP library, using the composer command below. Note that the composer command must run inside the web server's document root directory. The exact document root directory location depends on the web server and Linux distribution. For this example, the document root is /var/www.

    cd /var/www

    composer require drupal/amptheme


    Download AMP theme

    Download the AMP theme including the default ExAMPle sub-theme to the document root directory (e.g.,  /var/www).

    cd /var/www
    composer require drupal/amptheme


    Enable AMP sub-theme

    An AMP sub-theme must be enabled before enabling the AMP module. For this example, we enable the default ExAMPle sub-theme (ampsubtheme_example). Alternatively, you can enable a custom AMP sub-theme.

    If Drush, the command-line shell for managing Drupal, is already installed on your system, you can enable the sub-theme using the following Drush command. Note that the Drush command must be executed inside the document root directory.

    cd /var/www

    drush en ampsubtheme_example

    You can also enable the sub-theme through the Drupal web interface using the following procedure:


    1. Log in as a Drupal administrator.

            2. Select the Appearance page.

    1. Locate the ExAMPle sub-theme in the Uninstalled themes section, and click Install.
      There are 2 Install options available: Install, and Install and set as default. Select Install. The sub-theme should only be used on AMP pages, and therefore must not be set as the default theme.


    Enable AMP module

    The AMP module can be enabled using Drush or the Drupal web interface.
    To enable the AMP module using Drush, execute the Drush command below inside the document root directory:
    cd /var/www
    drush en amp


    To enable AMP using the web interface:

    1. Log in as a Drupal administrator.

            2. Select the Extend page.

    1. Scroll down to the Other section, and select both the Accelerated Mobile Pages(AMP) and Token modules.

    2. Click Install.


    Configure AMP

    Before AMP pages can be displayed, AMP needs to be configured using the web interface.


    1. Log in as a Drupal administrator.

    1. Select the Configuration page.

    1. Click AMP Configuration in the Content Authoring section.
      The AMP configuration page is displayed.

    1. Select ExAMPle Subtheme as the AMP theme, and click Save configuration button.
      The top of the AMP configuration page lists the AMP status by content type. Initially, AMP is disabled for all content types, e.g., article and basic page.

    1. Enable AMP for a content type, e.g., article, by clicking the corresponding Enable AMP in Custom Display Settings link.
      The Manage Display page is displayed as a result.

    1. Click to open Custom Display Settings.

    2. Select the AMP view mode, and click Save.
      Saving the setting returns you to the AMP Configuration page.

    1. Click Configure AMP view mode for the content type you've just AMP-enabled.
      All fields available to display for the content type are listed.

    1. Specify AMP format for fields, and click Save.
      The fields available depend on the content type. For the Body field, select AMP Text as the format. For Image, select AMP Image.

    1. Select the Structure page.

    2. Click Block layout.

    1. Select the ExAMPle Subtheme tab.
      This tab lists the blocks available for the sub-theme, e.g., Search, Breadcrumbs.  You can move specific blocks to different regions on the page, or remove them altogether. After you make the modifications, click Save blocks.


    Now, you are ready to view the AMP pages. You can view an AMP page using either of the following methods:


    1. Edit the page.
      Edit the page under Drupal, and instead of selecting Save and keep published, select Save and view AMP page.

    1. Append AMP suffix to URL.
      Browse to the regular non-AMP version of the page.  Manually append the suffix '?amp' to the end of the page URL, and hit Enter. For example, http://localhost/node/2 becomes http://localhost/node/2?amp.


    Summary & conclusion

    Despite tangible results, AMP is but 1 of several mobile web technologies aiming to decrease page loading time. Its competitors include Facebook Instant Articles and Apple News. AMP distinguishes itself by being the only open-source platform among the three.

    Why Open Source Technologies will Dominate the Market

    The decision of which technology to adopt will influence the bottom line of a company. Below, we list the advantages and disadvantages of AMP.


    AMP advantages
    • SEO    
      Although AMP per se is not a rank factor in Google searches yet, AMP pages, by virtue of faster loading time, contributes to better SEO results for mobile searches. Better search engine visibility, lower bounce rates, and higher click-through rates are all achievable benefits of AMP. Tips on how to optimize a Drupal website for SEO can be found here.

    • ROI       
      The cost of adopting AMP is generally lower than competing technologies because it leverages, not disrupt, existing web infrastructure. The return is a much better user experience which translates to improved mobile conversion rates.

    • Better behaving ads             
      Advertisers are an integral part of the AMP ecosystem. AMP ensures that ads displayed on AMP pages load quickly and do not detract from overall user experience.

    • Less stress on web servers                  
      AMP pages take up less data space, and can benefit from caching on AMP Cache servers. As a result, the stress on web servers is proportionally reduced.

    • Potential solution for smaller sites         
      Smaller websites may not have the IT budget to tackle speed challenges on mobile web. AMP provides a viable solution, especially for websites hosted on a CMS such as Drupal and WordPress. AMP support on Drupal eases the conversion of regular web pages to AMP pages.


    AMP disadvantages
    • Complexity
      An AMP-enabled website typically has both AMP pages targeting mobile users and regular web pages targeting desktop users. This is an added level of complexity for webmasters and search engines. The 2 versions of a web page must both be visible to search engines, but, at the same time, not viewed as duplicates. Given the newness of AMP, in-house AMP expertise may not be available for most businesses. For professional consulting, feel free to contact Vardot.

    • Customization
      AMP HTML restricts the types of HTML tags that can be used on an AMP page. All is well if an AMP page passes AMP validation. Otherwise, considerable web development expertise is required to make the necessary adjustment to pass the validation without sacrificing what you actually want to achieve. Even with the help of a CMS such as Drupal, customizing the look and feel of an AMP page requires in-depth knowledge of the AMP theme and how to craft sub-themes.

    • Uncertain industry-wide adoption
      AMP enjoys support from a growing number of platforms, vendors, and partners. However, given the competition from industry heavyweights such as Facebook and Apple, industry-wide domination is far from certain. With the backing of Google, AMP can potentially become the industry-standard format for mobile search pages, or, like Google Authorship, just another Google experiment that does not reach its full potential.

    And did you tru to set up accelerated mobile pages on your Drupal site? Share with us your experience in the comments section below.

    Tags:  Drupal drupal 8 Drupal Planet Title:  AMP Up Your Drupal Site Using Google's Accelerated Mobile Pages

    2 days 3 hours ago

I want a youtube link to show up inside a hero slider (field_collection not using a slider module). Wondering if i could get some help.

  • I have created a field in the field collection (field_video_link) [http://imgur.com/a/2lCn1] and I want to add the embed code but not sure if i am adding it right. Thanks

    <?php foreach ($slidesData as $i => $slideData): ?> <div class="slider-item slider-item-<?php print $i; ?>"> <div class="slider-image"> <div class="content"> <?php if (!empty($slideData['field_url']['#items'][0]['url'])): ?> <?php print l( '', $slideData['field_url']['#items'][0]['url'], $slideData['field_url']['#items'][0]['attributes'] ); ?> <?php else: ?> //This is what i added for the src i want to get the field url value from the db <iframe width="600px" height="449.49px" src="<?php ($slidesData[0]['field_video_link'] ['#items'][0]['video_url']) ?>" frameborder="0" allowfullscreen></iframe> <div> <?php endif; ?> </div> </div> submitted by /u/trashpanda666
    [link] [comments]

    2 days 12 hours ago

How to use RSS feeds for a field

Acquia Developer Center Blog: Decoupling Drupal with Waterwheel for Ember and React

Looking to make an Evernote/Checklist-type site for my own company. Mod recommendations? Drupal version?

Transitioning from SVN to Git

  • On December 1st, 2017, Acquia will be ending support for the SVN version control system, and at that time only Git will be supported. To help with the transition from SVN to Git, Acquia Support is presenting a webinar that will give an overview of the process and answer various questions on the subject.

    During this webinar, we will explain how to get started transitioning from SVN to Git, including:

    Language Undefined

    2 days 18 hours ago

Elevated Third: What is an Acquia Certified Grand Master

  • What is an Acquia Certified Grand Master What is an Acquia Certified Grand Master Zach Ettelman Mon, 06/26/2017 - 10:18

    Big congratulations to Tanner Langley, our Senior Drupal Developer turned Acquia Certified Grand Master. He has earned the highest ranking Drupal certification.

    Elevated Third is lucky to now have 3 of the world’s 150 Acquia Certified Grand Masters. Our Grand Master Drupal developers, Nick Switzer, Michael Lander, and Tanner Langley are incredibly important to our implementation workflow. They work on every website we launch.

    In order to help everyone understand the significance of this certification, we’ll discuss what a Grand Master is, what the certification process looks like, and the value a Grand Master provides.

      What is an Acquia Certified Grand Master?

    Let’s take a step back to understand Acquia’s role in this certification process. Acquia is the leading cloud platform SaaS company for Drupal websites and is led by Dries Buytaert, the creator of Drupal. They serve as the administrator and regulator of the premier professional certification program for Drupal. Having Dries Buytaert, the co-founder of Acquia and the creator of Drupal, develop this program provides an enormous amount of credibility. It demonstrates Acquia’s commitment to not only their platform but also to the whole Drupal community. With more knowledgeable and engaged developers bettering the community, Drupal’s power increases and in turn supports the companies that leverage Drupal for their digital experiences.

    To become an Acquia Certified Grand Master a developer has a one-year timeframe to complete three certification exams: Certified Developer, Certified Front End Specialist, and Certified Back End Specialist. Developers interested in taking the exams and becoming Grand Master certified can take the test online at any time, at testing centers across the world, or during DrupalCon, where most developers take the tests. 

      Why Does It Matter?

    Passing three of the hardest Drupal certification exams is a daunting task and those who pass the test should be applauded. But how does the time and effort into passing these certification exams translate to project success?

    When working with a Grand Master Drupal developer you are getting one of the top developers in the world and the knowledge of Drupal best practices and efficiency in mind. Staying up-to-date on industry trends and best practices gives them a unique perspective on the next Drupal challenge.

    Most importantly, our clients gain an incredible competitive advantage having access to Grand Master developers on their projects. Top Drupal talent in the industry gives our clients access to developers that are always looking for new ways to innovate and develop modules that deliver never before seen functionality within Drupal.

    Our Grand Master certified developers recently used their knowledge to develop a fully decoupled Drupal project, that has been highly successful for our client and serves as a benchmark in the industry.

    Let's take a deeper look into what is required of an Acquia Certified Grand Master. 

      Acquia Certified Developer Exam

    The more general of the three exams focus on the areas of fundamental web concepts, site building, front end development (theming), and back end development (coding). Specifically, the exam tests a developer’s level of knowledge and ability to:

    • Setup and configure new Drupal sites
    • Develop and implement new Drupal modules and themes
    • Customize and extend existing modules
      Acquia Certified Front End Specialist Exam

    This test specifically focuses on a developer’s skills and knowledge of Drupal front end theming, including:

    • Fundamental web development concepts, HTML, CSS, Javascript, PHP, jQuery
    • Theming concepts like custom regions, theme configuration, stylesheets, breakpoints, sub-themes
    • Templates and pre-process functions, Twig syntax, templating, Form Alter and Template Suggestions After
    • Layout configuration, Blocks, views, and the Responsive Image module
    • Performance/security, analyzing and resolving site performance/security issues from site configuration and custom themes


    Acquia Certified Back End Specialist Exam

    This exam validates the skills and knowledge of building and implementing Drupal solutions through module development. This test focuses on:

    • Fundamental web development concepts, HTML, CSS, Javascript, PHP programming, managing dependencies using Composer, Git for version control, and Automated Testing concepts
    • Drupal core API. Registering paths for URL requests using Routing system and Menu API, building and validating forms using Form API, interact with Entity system using Entity API, and ability to use Core APIs for building and extending Drupal functionality
    • Debug code and troubleshooting
    • Theme integration
    • Performance
    • Security
    • Leveraging community by contributing modules back to the Drupal community and ability to write code using Drupal Coding Standards

    To know there is a Grand Master on your project is to know your project will be influenced by someone with a well-rounded background of the entire development Drupal landscape, not just specialization in front end or back end development. This well-rounded background helps the developer have a better understanding of how the different pieces of a project come together to create a powerful, flexible, and scalable digital platform.

    Quite simply, having Grand Masters on our team ensures our clients get the top talent in the industry to develop their sites and produce extraordinary digital experiences for their own customers. 

    If you are looking for top Drupal talent for your project, let's talk

    2 days 20 hours ago

Questions To Ask Before a Drupal Project Kickoff

  • Project Managers are the anchor for any project. They need clarity on the intricacies of their project before kicking it off. It is indeed essential for them to ask the right set of questions and leave nothing to assumptions.

    Because delivery is a project manager’s responsibility, it’s essential to have a project manager who understands the length and breadth of the project. That way, they can answer every questions ranging from the vision to implementation flow and act as a common point to all the stakeholders involved in the project.

    Language Undefined

    2 days 20 hours ago