[et_pb_section bb_built="1" admin_label="section" _builder_version="3.0.51" next_background_color="#0e9117"][et_pb_row admin_label="row" background_position="top_left" background_repeat="repeat" background_size="initial"][et_pb_column type="4_4"][et_pb_post_title _builder_version="3.10.2" title="on" meta="off" author="off" date="off" categories="on" comments="off" featured_image="off" featured_placement="below" parallax_method="off" text_orientation="center" text_color="dark" text_background="off" border_style="solid" /][et_pb_text admin_label="Project categories" _builder_version="3.3.1" background_layout="light" text_orientation="center" border_style="solid" module_alignment="center"]
[project_categories]
[/et_pb_text][et_pb_image _builder_version="3.17.2" src="https://www.79mplus.com/assets/tyre-banner.jpg" sticky="off" border_style="solid" animation_style="slide" animation_duration="500ms" animation_intensity_slide="10%" animation_direction="left" /][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section bb_built="1" specialty="off" _builder_version="3.3.1" background_color="#0e9117" prev_background_color="#ffffff" next_background_color="#ffffff"][et_pb_row _builder_version="3.3.1" background_position_1="top_left" background_repeat_1="no-repeat"][et_pb_column type="4_4"][et_pb_text admin_label="Challenge Text" _builder_version="3.17.6" background_layout="dark"]
Challenge
In this project our client has been a renowned seller of radial tyres looking for a customization on their WordPress website. They wanted us to integrate a custom tyre search functionality based on a custom JSON API they found to be useful. The JSON API has the data they need and they wanted it to be incorporated into a frontend search on their WordPress website.
Our task mainly was to:
- Integrate JSON API into WordPress
- Integrate a custom tyre search feature into the frontend
- Implement a product meta to link the responses with actual products
- Provide analytics about searches
- Downloadable analytics to gather insights about the searches done
[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section bb_built="1" fullwidth="off" specialty="off" prev_background_color="#0e9117" next_background_color="#f9d339"][et_pb_row background_position="top_left" background_repeat="repeat" background_size="initial"][et_pb_column type="4_4"][et_pb_text admin_label="Our Solution (new)" _builder_version="3.17.2" text_orientation="center"]
Our Solution
The project was simple in words but we had to get into the solution.
Here’s how we solved the problem:
[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row background_position="top_left" background_repeat="repeat" background_size="initial"][et_pb_column type="1_3"][et_pb_text _builder_version="3.17.6" header_text_align="center" header_3_line_height="1.3em"]
JSON API Integration
The JSON API client suggested to be used was a data feed system made for tyres. With proper requests, it can bring in detailed information about tyre type, make, model, year etc. We prepared a plugin for the client that integrated the JSON API into WordPress.
[/et_pb_text][/et_pb_column][et_pb_column type="1_3"][et_pb_text _builder_version="3.17.6" header_text_align="center" header_3_line_height="1.3em"]
Custom Search
We prepared a special shortcode for placing the search into a page. The shortcode worked through its code to place a search field. When submitted, it prepares to pass the request through the JSON API and the response data is processed to present search results.
[/et_pb_text][/et_pb_column][et_pb_column type="1_3"][et_pb_text _builder_version="3.17.6" header_text_align="center" header_3_line_height="1.3em"]
Linking Products
We have added a setting for each product under the Advanced tab. This changes a meta field which stores the tyre identification string that is present on the API response. This helps us in turn to link the particular product with a specific response from the API.
[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row background_position="top_left" background_repeat="repeat" background_size="initial" _builder_version="3.10.2"][et_pb_column type="1_3"][et_pb_text _builder_version="3.17.6" header_text_align="center" header_3_line_height="1.3em"]
Search Analytics
Besides handling the JSON API integration into search results, our client wanted to know how many customers searched for which products. So we built an internal analytics system around the search mechanism so that there is a record of each search query by users.
[/et_pb_text][/et_pb_column][et_pb_column type="1_3"][et_pb_text _builder_version="3.17.6" header_text_align="center" header_3_line_height="1.3em"]
Downloadable Analytics
We implemented a download feature for the analytics collected. It exports to a widely compatible csv file. It helps the client to observe the data more closely on their favorite software package on desktop.
[/et_pb_text][/et_pb_column][et_pb_column type="1_3"][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section bb_built="1" specialty="off" _builder_version="3.3.1" background_color="#f9d339" prev_background_color="#ffffff"][et_pb_row background_position="top_left" background_repeat="repeat" background_size="initial"][et_pb_column type="4_4"][et_pb_image _builder_version="3.17.6" src="https://www.79mplus.com/assets/tyre-project-image.jpg" align="center" max_width="400px" animation_style="slide" animation_duration="500ms" animation_intensity_slide="10%" animation_direction="left" url="https://www.79mplus.com/assets/tyre-project-image.jpg" /][et_pb_text admin_label="Putting it all together" _builder_version="3.17.2" text_orientation="center" module_alignment="center"]
Putting it all together
When we finished, we delivered a better API-integrated custom search which helped both the users and our client to find what they need.
[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section]
