{"id":2874,"date":"2023-12-22T22:29:07","date_gmt":"2023-12-22T22:29:07","guid":{"rendered":"https:\/\/developers.maplink.global\/customizing-the-tracking-page-theme\/"},"modified":"2024-03-05T13:59:12","modified_gmt":"2024-03-05T13:59:12","slug":"customizing-the-tracking-page-theme","status":"publish","type":"post","link":"https:\/\/developers.maplink.global\/en\/customizing-the-tracking-page-theme\/","title":{"rendered":"Customizing the tracking page theme"},"content":{"rendered":"\n<p>You can create themes to customize the <em>white-label<\/em> tracking page with your brand&#8217;s colors, icons, and logo.<\/p>\n\n<ul class=\"wp-block-list\">\n<li><a href=\"#criar\">Create new theme<\/a><\/li>\n\n\n\n<li><a href=\"#atualizar\">Update theme<\/a><\/li>\n\n\n\n<li><a href=\"#consultar\">Consult theme<\/a><\/li>\n\n\n\n<li><a href=\"#excluir\">Delete theme<\/a><\/li>\n\n\n\n<li><a href=\"#exemplo\">Example &#8211; Customizing the Tracking Page Theme<\/a><\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"criar\">Create new theme<\/h2>\n\n<p>To create a theme, you must send a request with the <strong>POST<\/strong> method to the following endpoint:<\/p>\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/api.maplink.global\/tracking\/v1\/themes\/\">https:\/\/api.maplink.global\/tracking\/v1\/themes\/<\/a> &#8211; <strong><mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-luminous-vivid-amber-color\">POST<\/mark><\/strong><\/li>\n<\/ul>\n\n<p>An example of a request can be seen below:<\/p>\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"json\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">{\n   \"id\": \"Maplink\",\n   \"logo\": \"https:\/\/example.com\",\n   \"color\": \"#FF0000\",\n   \"favicon\": \"https:\/\/example.com\",\n   \"language\": \"pt_BR\"\n}<\/pre>\n\n<p>Where:<\/p>\n\n<ul class=\"wp-block-list\">\n<li><code>id<\/code> &#8211; ID to identify the theme.<\/li>\n\n\n\n<li><code>logo<\/code> &#8211; Logo image URL. Dimensions of <strong>40px in height<\/strong> and <strong>120px in width<\/strong> are recommended.<\/li>\n\n\n\n<li><code>color<\/code> &#8211; Hexadecimal value for the main color of the website. Ex: #FF0000<\/li>\n\n\n\n<li><code>favicon<\/code> &#8211; URL of the website <em>favicon<\/em> image. Dimensions of <strong>48px in height<\/strong> and <strong>48px in width<\/strong> are recommended.<\/li>\n\n\n\n<li><code>languague<\/code> &#8211; Website language. Possible values: [<code>\"en\", \"pt\", \"pt_BR\", \"pt_PT\", \"es\", \"es_AR\", \"es_CL\", \"es_CO\", \"es_MX\"<\/code>]<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"atualizar\">Update theme<\/h2>\n\n<p>To update an existing theme, simply send a request with the <strong>PUT<\/strong> method to the following endpoint:<\/p>\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/api.maplink.global\/tracking\/v1\/themes\/%7B%7BtrackingTheme%7D%7D\">https:\/\/api.maplink.global\/tracking\/v1\/themes\/<strong>{{trackingTheme}}<\/strong><\/a> &#8211; <strong><mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-vivid-cyan-blue-color\">PUT<\/mark><\/strong><\/li>\n<\/ul>\n\n<p>The term <code>{{trackingTheme}}<\/code> should be replaced with the ID of the theme you want to update.<\/p>\n\n<p>An example of a request can be seen below:<\/p>\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"json\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">{\n   \"id\": \"Maplink\",\n   \"logo\": \"https:\/\/example.com\",\n   \"color\": \"#0000CD\",\n   \"favicon\": \"https:\/\/example.com\",\n   \"language\": \"pt_BR\"\n}<\/pre>\n\n<h2 class=\"wp-block-heading\" id=\"consultar\">Consult theme<\/h2>\n\n<p>To query a theme, simply send a request with the <strong>GET<\/strong> method to the following endpoint:<\/p>\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/api.maplink.global\/tracking\/v1\/themes\/%7B%7BtrackingTheme%7D%7D\">https:\/\/api.maplink.global\/tracking\/v1\/themes\/<strong>{{trackingTheme}}<\/strong><\/a> &#8211; <strong><mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-vivid-green-cyan-color\">GET<\/mark><\/strong><\/li>\n<\/ul>\n\n<p>The term <code>{{trackingTheme}}<\/code> must be replaced by the ID of the theme you want to consult.<\/p>\n\n<h2 class=\"wp-block-heading\" id=\"excluir\">Delete theme<\/h2>\n\n<p>To delete a theme, simply send a request with the <strong>DELETE<\/strong> method to the following endpoint:<\/p>\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/api.maplink.global\/tracking\/v1\/themes\/%7B%7BtrackingTheme%7D%7D\">https:\/\/api.maplink.global\/tracking\/v1\/themes\/<strong>{{trackingTheme}}<\/strong><\/a> &#8211; <strong><mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-vivid-red-color\">DELETE<\/mark><\/strong><\/li>\n<\/ul>\n\n<p>The term <code>{{trackingTheme}}<\/code> should be replaced with the ID of the theme you want to delete.<\/p>\n\n<h2 class=\"wp-block-heading\" id=\"exemplo\">Example &#8211; Customizing the Tracking Page Theme<\/h2>\n\n<p>In the following example, we will create a theme for the \u201cHome Delivery\u201d company tracking page. <\/p>\n\n<p>The request with the icon, logo and color of the customized theme can be seen below:<\/p>\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"json\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">{\n    \"id\": \"HomeDelivery\",\n    \"logo\": \"https:\/\/i.ibb.co\/4MTKPLy\/logo.png\",\n    \"color\": \"#e8af46\",\n    \"favicon\": \"https:\/\/i.ibb.co\/Fh1qVqV\/ico.png\",\n    \"language\": \"pt_BR\"\n}<\/pre>\n\n<p>After that, simply enter the name of the theme in the parameter <code>theme<\/code> when creating an order, as shown in the example below:<\/p>\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"json\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">{\n  \"number\": \"1232132132143438\",\n  \"description\": \"Product\",\n  \"companyName\": \"Maplink\",\n  \"status\": {\n    \"value\": \"ON_THE_WAY\",\n    \"label\": \"Pedido em tr\u00e2nsito\"\n  },\n  \"destination\": {\n    \"mainLocation\": {\n      \"lat\": -22.7342864,\n      \"lon\": -47.6480644\n    }\n  },\n  \"driver\": {\n    \"name\": \"Maplink BR\",\n    \"currentLocation\": {\n      \"lat\": -23.564515,\n      \"lon\": -46.652681\n    }\n  },\n  \"theme\": \"HomeDelivery\"\n}<\/pre>\n\n<p>The customized tracking page can be seen in the image below:<\/p>\n\n<p class=\"has-text-align-center\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/lh7-us.googleusercontent.com\/WNAycUwHugPHRsREO-Wv0FDVWgb7tVXMq36s-gKskdZa-hkP7Sdi1DhTcK1HFke3RJl4OiMRixRjly8i4tKpwm1nC9y87Oq-FwFgz5jtMdtfDomLlFNXvGdUaUQhSXJcu5IL6cOM8WKF_j2HIofoVi8\" width=\"703\" height=\"329\"\/><\/p>\n","protected":false},"excerpt":{"rendered":"<p>You can create themes to customize the white-label tracking page with your brand&#8217;s colors, icons, and logo. Create new theme To create a theme, you must send a request with the POST method to the following endpoint: An example of a request can be seen below: Where: Update theme To update an existing theme, simply [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[171],"tags":[],"class_list":["post-2874","post","type-post","status-publish","format-standard","hentry","category-tracking-en"],"acf":[],"_links":{"self":[{"href":"https:\/\/developers.maplink.global\/en\/wp-json\/wp\/v2\/posts\/2874","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/developers.maplink.global\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/developers.maplink.global\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/developers.maplink.global\/en\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/developers.maplink.global\/en\/wp-json\/wp\/v2\/comments?post=2874"}],"version-history":[{"count":1,"href":"https:\/\/developers.maplink.global\/en\/wp-json\/wp\/v2\/posts\/2874\/revisions"}],"predecessor-version":[{"id":2875,"href":"https:\/\/developers.maplink.global\/en\/wp-json\/wp\/v2\/posts\/2874\/revisions\/2875"}],"wp:attachment":[{"href":"https:\/\/developers.maplink.global\/en\/wp-json\/wp\/v2\/media?parent=2874"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/developers.maplink.global\/en\/wp-json\/wp\/v2\/categories?post=2874"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/developers.maplink.global\/en\/wp-json\/wp\/v2\/tags?post=2874"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}