How to find theme asset url?

O O ! you got it.

Please remove the function algoliaSearch(); on script file, the error still exists.

Figured it out! There was a bit about Algolia further up on the js page that I missed. Thank you all for your help!

Okay, just wait, I'll check what's the causes.

I tested removing the Algolia section from the js file and it still interferes with the script on the article_page.hbs

<script>

 $(document).ready(function () {
// Style tables
$(".article-body table").each(function () {
if (!$(this).parent().hasClass('Vlt-table')) {
$(this).wrap('<div class="Vlt-table Vlt-table--data"/>');
$(this).find("tr:first-of-type").insertBefore($(this).find('tbody')).wrap('<thead/>');
$(this).find("thead td").each(function(){
$(this).replaceWith($('<th>' + this.innerHTML + '</th>'));
})
}
});

$('table td, table th, table, table tr, table thead, table tbody, table span, table p, table div').attr('style', '');
$('.article-body h1,.article-body h2, .article-body h3, .article-body h4, .article-body span, .article-body p, .article-body h5').attr('class', '').attr('align','');

// Style lists

$('.article-body ul').addClass('Vlt-list Vlt-list--simple');

// Style feedback 

$('.Nx-article-vote__down').append('<svg class="Vlt-red"><use xlink:href="#Vlt-icon-unhappy"/></svg>');
$('.Nx-article-vote__up').append('<svg class="Vlt-green"><use xlink:href="#Vlt-icon-happy"/></svg>');

 });
</script>

You have already  commented the CDNs but the function exists so remove the function algoliaSearch(); on script file wherever it's calling.

We want to remove Algolia search, which is why I commented out the script. What is a better way to remove Algolia search?

Hi,

You need to update the CSS for background social icon, have look at what I did:

1). You current code for linkedin icon -

.Footer-links-social li.linkedin a {
background-image: url(//theme.zdassets.com/theme_assets/39809/2a0de24….png) center center no-repeat;
display: block;
 height: 30px;
 width: 30px;
background-size: 30px;
}

After - 

.Footer-links-social li.linkedin a {
background: url(//theme.zdassets.com/theme_assets/39809/2a0de24….png) center center no-repeat;
display: block;
 height: 30px;
 width: 30px;
background-size: 30px;
}

What I did =>

background-image   =>   background

2). Output is 

Current:

After:

And

You would get the solution of your second question when your console error would be solved.

What you did -

You commented the CDN of Algolia search on document_head.hbs file see the below screenshot for the same.

the condole error is -

What I did - 

I added the CDNs of Algolia search on document_head.hbs file, see the below screenshot for the same:

and script code of Algolia search exists on script.js file, see the below screenshot for the same:

 The CDNs is commented that's why your Algolia code throwing error (Not defined). You just need to add CDNs for Algolia code on document_head file and add the function code on script.js file as I did.

1). CDNs - Copy the CDN and paste it into document_head.hbs file.

<script src="https://cdn.jsdelivr.net/algoliasearch/3/algoliasearch.min.js"></script>
<script src="https://cdn.jsdelivr.net/autocomplete.js/0/autocomplete.min.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/algoliasearch.zendesk-hc/2/algoliasearch.zendesk-hc.min.css">
<script type="text/javascript" src="//cdn.jsdelivr.net/algoliasearch.zendesk-hc/2/algoliasearch.zendesk-hc.min.js"></script>

2). Copy the below Algolia code  and paste it into script.js file at the end of all code.

$(document).ready(function(){
//Algolia Search
function algoliaSearch() {
var client = algoliasearch('QWYTZ63XKQ', '89fd2fde7777d159b5a50846e5925379'); // search only API key
    var helpdesk = client.initIndex('zendesk_nexmo_articles');
    var developer = client.initIndex('production_nexmo_developer');
  
  var searches = [{
        autoselect: true,
        autoselectOnBlur: true,
        source: autocomplete.sources.hits(developer, { hitsPerPage: 10 }),
        displayKey: 'body',
        templates: {
          header: '<h4 class="Nx-search__title">Developer</h4>',
          suggestion: function(suggestion) {        
            var descriptionEllipses = suggestion.description && suggestion.description.length > 110 ? '...' : '';
            var description = suggestion.description ? suggestion.description.substring(0, 110) + descriptionEllipses : '';
            var highlight = suggestion._highlightResult.body.value ? suggestion._highlightResult.body.value.substring(0, 110) : '';
            return '<a class="Nx-search__result" href=https://developer.nexmo.com' + suggestion.path +  ' target="_blank">' +
                '<h6 class="Nx-search__result__title Vlt-blue-dark">' + suggestion.title + ' <small class="Vlt-grey-dark">' + suggestion.heading + '</small></h6>'  +
                '<div><small class="Nx-search__result__desc Vlt-black">' + description + '</small>' +
                '<small class="Nx-search__result__snippet Vlt-grey-dark">...' + highlight + '...</small></div>' +
              '<div class="Vlt-badge Vlt-badge--grey">' + suggestion.product + '</div>' +
            '</a>';
          }, 
          empty: function() {
            return '<p class="Nx-search__no-results">No results</p>'
          }
        }
      },
      {
        autoselectOnBlur: true,
        autoselect :true,
        source: autocomplete.sources.hits(helpdesk, { hitsPerPage: 10 }),
        displayKey: 'title',
        templates: { 
          header: '<h4 class="Nx-search__title">Knowledge base</h4>',
          suggestion: function(suggestion) {
            var highlight = suggestion._snippetResult.body_safe.value ? suggestion._snippetResult.body_safe.value.substring(0, 110) : '';
            var sectionEllipses = suggestion.section.full_path.length > 30 ? '...' : '';
            var section = suggestion.section.full_path ? suggestion.section.full_path.substring(0, 30) + sectionEllipses : '';
            return '<a class="Nx-search__result" href=https://help.nexmo.com/hc/en-us/articles/' + suggestion.id +  '>' +
                '<h6 class="Nx-search__result__title Vlt-blue-dark">' + suggestion.title + '</h6>' +
                '<div><small class="Nx-search__result__snippet Vlt-grey-dark">...' + highlight + '...</small></div>' +
               '<div class="Vlt-badge Vlt-badge--grey">' + section + '</div>' +
            '</a>';
          }, 
          empty: function() {
            return '<p class="Nx-search__no-results">No results</p>'
          }
        }
      }]
autocomplete('.Nx-home-search #query', {}, searches);
  autocomplete('.Nx-search #query', {}, searches);
}
   
algoliaSearch();
});

And then let me know if another issue arises.

Have a nice day :)

Thanks 

Ifra Saqlain It's https://help.nexmo.com/hc/en-us

The issue with the footer social media icons seems to have been having the wrong link for the images. I updated that in the CSS.

The second issue is that I commented out the script to run Algolia search so I could revert to native Zendesk search. That affected a script on the article page template which was put in place to render table styles, bullet point styling, and the article voting images. The script is supposed to run after the document is ready, and commenting out the Algolia script in the document head seems to prevent the document from being ready.

I'm trying to understand why those style elements are in a script on the article page instead of in the CSS.

it's not working.