Belt and Road Responsive: Drupal 8 Website

Size: px

Start display at page:

Download "Belt and Road Responsive: Drupal 8 Website"

James Bailey
6 years ago
Views:

1 Belt and Road Responsive: Drupal 8 Website

2 Belt and Road Responsive: Drupal 8 Website Contents 1.0 Project Overview P Project Challenges & Highlights P Project Results P Technical Specifications P.6

for Hong Kong-based manufacturers, traders and service providers.

3 1.0 Project Overview Section 1.1 Hong Kong Trade Development Council(HKTDC) The Hong Kong Trade Development Council (HKTDC) is a statutory body established in 1966 as the international marketing arm for Hong Kong-based manufacturers, traders and service providers. They are the trade and development council for the city-state of Hong Kong, with more than 40 offices around the world, including 13 on the Chinese mainland. The HKTDC wanted to create an unparalleled, robust and highly scalable Portal, that provides various resources on the Belt and Road Initiative (also known as One Belt One Road or the Silk Road ) spearheaded by the Chinese. 1.0 Project Overview P.3

4 Section 1.1 Thanks to a proven track record in Drupal, a wealth of experienced developers, designers and architects, not to mention a superior Drupal 8 expertise, Appnovation were selected to deliver the project, using their Hong Kong and UK based teams in a global collaboration. As a company that helps fund, and makes regular contributions to the Drupal community, this project further fortifies their burgeoning Drupal 8 portfolio. Belt and Road Homepage Appnovation s D8 experts were tasked with delivering the full reimplementation of HKTDC s Belt and Road portal, including a complete rebranding of their website with new functionalities, and migration of content from different sources. 1.0 Project Overview P.4

5 2.0 Project Challenges & Highlights Section 2.1 The Belt and Road initiative is a development strategy and framework launched by the Chinese Government that aims to foster growth and development between China and the rest of Eurasia. This initiative encompasses around 60 countries, and has been contrasted with trading agreements like the Trans-Pacific Partnership. HKTDC s Belt and Road website is one of the earliest websites providing official information and resources on this large-scale initiative. Appnovation s D8 experts delivered the reimplementation of HKTDC s Belt and Road portal, including complete rebranding of their legacy website with new functionalities, and migration of content from different sources including external web sources. Implemented new website with emphasis on Drupal 8 s core functionalities Clean and simple site architecture Content migration of 9,000+ pieces of content in multiple languages (English, simplified Chinese, traditional Chinese) Hosted on Acquia Cloud, allowing our team to push code quickly (less than 5 minutes) without disrupting the live website s functionality Initial implementation completed within 3 weeks for initial soft launch 2.0 Project Challenges & Highlights P.5

with new functionalities, and migration of content from different sources including external web sources.

6 3.0 Project Results Section 3.1 Appnovation s D8 experts delivered the reimplementation of HK- TDC s Belt and Road portal, including complete rebranding of their legacy website with new functionalities, and migration of content from different sources including external web sources. Belt and Road for Mobile Devices With the newly revitalized website, HKTDC s brand was given a more modern and clean design. Content that was previously spread across different websites was centralized, creating clear, simple and easy to use navigation, providing a positive user experience. 3.0 Project Results P.6

7 4.0 Technical Specifications Section 4.1 Utilized Technologies and Platforms Drupal 8.3 Acquia Cloud Atlassian JIRA Amazon Web Services Symfony DomCrawler, Filesystem and Serializer Guzzle Section 4.2 Modules/Themes/Distribution admin_toolbar admin_toolbar_tools module_filter config_split country double_field video page_manager page_manager_ui mailsystem smtp imce pathauto persistent_login rabbit_hole rh_node r4032login twig_tweak ultimate_cron panels panels_ipe queue_ui search_api_db facets search_api simple_sitemap sharethis captcha views_data_export default_content default_content_extra csv_serialization webform webform_ui 4.0 Technical Specifications P.7

8 Section 4.2 Bootstrap The reason we used Bootstrap can be summed up as:- Sleek, intuitive, and powerful mobile first front-end framework for faster and easier web development.. Admin Toolbar, Module Filter The reason we used Bootstrap can be summed up as:- Sleek, intuitive, and powerful mobile first front-end framework for faster and easier web development.. Config Split We used config split module to handle segmentation of feature config during the development cycles of the project. We only have 3 weeks effectively to create and push to production so things had to be kept in order to ensure fast paced development, feature completion cycles. Ultimate Cron We needed to employ ultimate cron to ensure that our custom cron jobs could run at certain times of the day as they were imported content from an existing central CMS. 4.0 Technical Specifications P.8

Section 4.2 Search API, Facets and Search API DB https://www.drupal.

org/project/facets Limited budget and time required us to use Search API with DB but at

9 Section 4.2 Search API, Facets and Search API DB Limited budget and time required us to use Search API with DB but at least bring to the table facets and possibility of in the future of moving into Solr or alike. D8 Search Functionality 4.0 Technical Specifications P.9

10 Section 4.2 Views Data Export, CSV Serialization It was necessary on this project to provide a mechanism for exporting users to import into a in-house marketing tool and this was achieved easily using the views data export module. Along side this we were required to provide CSV exports of data of projects for user consumption; this feature was enabled through implementation of the CSV serialization module which is used by views data export anyway, savings us time to implement on this feature. Webform Webform module was key to providing various forms for communication with HKTDC backend office staff. The capabilities of webform allowed us to take existing hardcoded forms and revamp to dynamic managed forms very easily and in 3 languages including English, Simple and Traditional Chinese. With is powerful config management; and plugin architecture would could extend were necessary for additional feature handling easily. A great module which will feature heavily in forms for future projects 4.0 Technical Specifications P.10

11 D8 Sign Up Page Section 4.2 Default Content Default content module was instrumental to us for being able to manage static content, which could be pre-loaded into a freshly built site or transported to various environments intact. Page Manager Default content module was instrumental to us for being able to manage static content, which could be pre-loaded into a freshly built site or transported to various environments intact. IMCE At time of building the website, the media module was not quite stable enough so we opted to move forward with IMCE for media, file management solution. Editors are able to upload, find and attached images to WYSIWYG fields which has served the solution well thus far. 4.0 Technical Specifications P.11

12 Open Digital Delivered.

Connecting Global Insight with CTG Monthly News

Connecting Global Insight with CTG Monthly News China Telecom Joins Sino-British Entrepreneurs Committee As a representative of the telecoms industry, China Telecom was named a member of the Sino-British