• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

How to activate search bar in static html page

Community Beginner ,
Apr 29, 2020 Apr 29, 2020

Copy link to clipboard

Copied

Hi,

I have created a search button in a static web page, but cannot activate it. It returns nothing when I try to search sime word or text in the page or a related page. Pls note that I am not after Google seacrh activation but search engine of the website's own. Also note that webpage is notnpublished but static one. I have heard about some php way, but do not know what wxact coding use and its place to add.

Could you give any tip how to fix it pls?

 

Pls find search button coding below

 

Thanks

 

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
input[type=text] {
width: 136px;
box-sizing: border-box;
border: 2px solid ;
border-radius: 4px;
font-size: 15px;
background-color: white;
background-image: url("image/iconfinder_common-search-lookup-glyph_763283.png");
background-position: 6px 6px;
background-repeat: no-repeat;
padding: 12px 40px 16px 45px;
-webkit-transition: width 0.4s ease-in-out;
transition: width 0.4s ease-in-out;
}

input[type=text]:focus {
width: 28%;
}
</style>
</head>
<body>

 


<input name="search" type="text" class="search" placeholder="Search..">


</body>
</html>

 


<input name="search" type="text" class="search" placeholder="Search..">


</body>
</html>

Views

628

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Apr 29, 2020 Apr 29, 2020

Copy link to clipboard

Copied

Without a script, this is impossible.

 

For more info Google the subject or see https://gomakethings.com/how-to-create-a-vanilla-js-search-page-for-a-static-website/

Wappler, the only real Dreamweaver alternative.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Apr 30, 2020 Apr 30, 2020

Copy link to clipboard

Copied

My only concern is if you need a search facility on your website then it has to be a pretty big website with lots of content. Building a 'searchIndex' array is going to be hugley time consuming if you want to cover every conceivable page on the website. Maybe using it for a 'section' search would be more viable with a limited amount of keywords which pull back the results.

 

I did something similar for a website to search for holiday destinations, picking out key locations within the itinerary information. This was php based using a database but it put a hell of a lot more time on the job identifying all the keywords to use or thinking what a user would possibly search for in addition to the obvious keywords.

 

A lot of automated searches are not that great, they pull back a load of junk and be wary of the Google search as it may list a lot of pages that no longer exist on your website. Google takes time to unlist pages and sometimes never does unless you intervene.

 

 

 

 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Apr 30, 2020 Apr 30, 2020

Copy link to clipboard

Copied

LATEST

I think building a complicated search engine is above your skill-set especially since your site is not dynamically driven. 

 

Use FreeFind Online Search Engine.  The free version has ads, paid versions without ads are available.

https://www.freefind.com/

1. Set-up your FreeFind account. 

2. Copy & paste the FreeFind search form code into your site pages.

3. Publish your site online. 

4. Tell FreeFind to crawl and index your site.  It usually occurs within a few hours. 

5. When you make substantial changes to your site, tell FreeFind to crawl and index your site again.

 

Nancy O'Shea— Product User, Community Expert & Moderator
Alt-Web Design & Publishing ~ Web : Print : Graphics : Media

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines