Menu
I would just love to try creating an AMP HTML website. However, what I cannot miss is our search function.
From what I understand so far, a search (input field, JavaScript handler) would not be possible with AMP HTML.
Is there any way to provide a neat search functionality within AMP HTML? Maybe using the amp-list component?
379
Forms are supported in AMP via the amp-form component. Using amp-form, you can embed a search form into your AMPs and render the search results into a new AMP on your server.
This is a search form in AMP:
<html>
<head>
<script async custom-element="amp-form" src="https://cdn.ampproject.org/v0/amp-form-0.1.js"></script>
<!-- ... AMP boilerplate ... -->
</head>
<body>
<form method="get" action="https://example.com/search" target="_top">
<input name="search" type="search">
<input type="submit" value="">
</form>
</body>
</html>
https://example.com/search can then render to an AMP page showing the search results:
<html>
<head>
<!-- ... AMP boilerplate ... -->
</head>
<body>
<h1>Results</h1>
<ul>
<li>Result 1</li>
<li>Result 2</li>
</ul>
</body>
</html>
You can find a working sample for a search implemented with AMP here.
128
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
