Adding Google search to a page modal

I am using a theme called Dimension, which is a one-page Hugo theme and instead of pages it uses modals.
I would like to add Google search codes to only one of the modals. For example, I want to create a .md file called search, and then add a search button to my main page. When the search button is pressed I want that the search modal (#search) to pops-up and the Google search box to show up. Is there a way to add the Google search code that is something like:

  (function() {
    var cx = '006389791431410470787:s9zotyq0r7m';
    var gcse = document.createElement('script');
    gcse.type = 'text/javascript';
    gcse.async = true;
    gcse.src = '' + cx;
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(gcse, s);

to an .md file not to index.html?

This is a theme-specific question. If you’ve gotten that code to work in a different theme, but not Dimension, you ought to bring it up in its issues.

Dimension is kinda different from most themes, so I suggest you try to get that search working in a different theme, because you’ll need to use partials or add that to a template, and that will help you approach the single page layout in Dimension.

Thanks maiki.
I have added this to the issue list of Dimenstion.

But why do you say Dimension is different than most themes? I see many single page themes on the Hugo theme list.

I’ve unscientifically tried most of the themes in the showcase, and Dimension stuck out to me as to how it populates the single page. Most one page themes use either a specific file (index.{md|html}) or site configurations to change elements, such as listing social media accounts.

Dimension is very cool, and it is that way because it handles content in an interesting way. Because it is interesting and non-standard, it is easier to find out what is happening from the theme developer, rather than the general knowledge pool. :slight_smile: