Skip to content

Commit

Permalink
readme update
Browse files Browse the repository at this point in the history
  • Loading branch information
zsoltoroszlany82 committed Nov 12, 2024
1 parent 8be4266 commit 52161d1
Show file tree
Hide file tree
Showing 4 changed files with 101 additions and 112 deletions.
69 changes: 25 additions & 44 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,66 +1,47 @@
# Playful Sparkle - Live Search for OpenCart 4

**Playful Sparkle - Live Search** is an advanced search extension for OpenCart 4.x+ that displays search results in a dynamic dropdown as users type. It enhances the search experience by providing immediate feedback with relevant results across various types, including products, categories, manufacturers, and information pages. Perfect for OpenCart stores looking to provide a quick and convenient search solution.
The **Playful Sparkle - Live Search** extension for OpenCart 4.x+ revolutionizes the search functionality by offering real-time, autocomplete suggestions as users type, making it easier to find relevant products. With the flexibility to customize the search results, store owners can enable or disable different types of suggestions, control the length of product descriptions, and adjust the visibility and size of product images. The extension also supports multi-language and multi-store setups, ensuring a seamless experience across various regions and storefronts. Whether you’re running a single store or multiple, this extension adapts to your needs, offering an efficient and user-friendly search solution for your eCommerce platform.

## Features
---

- **Instant Dropdown Search**: As users type, results display in a dropdown, offering a fast and engaging search experience.
- **Comprehensive Search Options**:
- **Product Search**: Displays product name, description, sale price, regular price, pre-tax price, and thumbnail.
- **Category Search**: Shows category names in a hierarchy (separated by ">") and thumbnail.
- **Manufacturer Search**: Includes manufacturer name and thumbnail.
- **Information Pages**: Displays the name of the information pages.
- **Customizable Thumbnails**: Thumbnail dimensions (width and height) are adjustable to match store design.
- **Adjustable Search Delay**: Define a delay between user keystrokes and data requests to optimize server load and user experience.
- **Configurable Product Description Length**: Control the length of product descriptions displayed in search results for clarity.
- **Multilingual Support**: The extension is available in the following languages:
- Čeština (cs-cz)
- Deutsch (de-de)
- English (GB) (en-gb)
- English (US) (en-us)
- Español (es-es)
- Français (fr-fr)
- Magyar (hu-hu)
- Italiano (it-it)
- Русский (ru-ru)
- Slovenčina (sk-sk)

## Installation Instructions
## Features

### 1. Download the Extension
Download the latest **Playful Sparkle - Live Search** release from this repository.
- **Real-time Autocomplete Suggestions**: Displays instant, real-time search suggestions as customers type, making it faster and easier for users to find products.
- **Customizable Search Results**: Administrators can enable or disable specific suggestion categories like products, offering full control over the search experience.
- **Adjustable Product Descriptions**: Customize the length and display of product descriptions in the search results, allowing for a clean and informative layout tailored to your preferences.
- **Image Display Customization**: Choose whether to display product images in the search results and control their visibility and size, offering a visually appealing user experience.
- **Enhanced User Experience**: With an intuitive search interface and customizable display options, customers can find exactly what they’re looking for quickly and easily, leading to a better shopping experience.
- **Compatibility**: Integrates smoothly with OpenCart 4.x+, supporting a range of online store setups.
- **Multi-store Support**: Supports multi-store setups by default, making it easy to integrate across multiple OpenCart stores.
- **Multilingual Support**: Ready for international use with languages including Čeština (cs-cz), Deutsch (de-de), English (GB) (en-gb), English (US) (en-us), Español (es-es), Français (fr-fr), Magyar (hu-hu), Italiano (it-it), Русский (ru-ru), and Slovenčina (sk-sk).

### 2. Upload the Extension Files
1. Log in to your OpenCart admin panel.
2. Navigate to `Extensions > Installer`.
3. Click the `Upload` button and upload the `ps_live_search.ocmod.zip` file.
---

### 3. Install the Extension
4. Once uploaded, click on the green `Install` button.
5. Navigate to `Extensions` and select `Modules` from the dropdown.
6. Locate the **Playful Sparkle - Live Search** extension in the list.
7. Click on the green `Install` button.
## Installation Instructions

### 4. Configure the Extension
1. After installation, remain on the `Extensions` page and ensure `Modules` is selected from the dropdown.
2. Click the `Edit` button next to the installed extension.
4. Configure the extension as desired.
5. Save your configuration.
1. Download the latest version from this repository.
2. Log in to your OpenCart admin panel.
3. Navigate to `Extensions > Installer`.
4. Click the `Upload` button and upload the `ps_live_search.ocmod.zip` file.
5. Locate the extension in the `Installed Extensions` list and click the `Install` button.
6. Navigate to `Extensions > Extensions` and select `Modules` from the `Choose the extension type` dropdown list.
7. Locate the extension in the `Modules` list and click the `Install` button.
8. Click the `Edit` button, configure the extension parameters, and click the `Save` button to save your settings.

---

## Support & Feedback
## Support & Inquiries

For support or any inquiries regarding the extension, feel free to open an issue on this repository or reach out via email at [[email protected]](mailto:[email protected]).
For assistance or inquiries related to this extension, please open an issue on this repository or contact us via email at [[email protected]](mailto:[email protected]).

---

## License

This project is licensed under the GPL-3.0 license. See the [LICENSE](./LICENSE) file for more information.
This project is distributed under the GPL-3.0 license. Please refer to the [LICENSE](./LICENSE) file for further details.

---

## Contributing

We welcome contributions! If you would like to contribute to this project, please fork the repository and submit a pull request with your changes.
We encourage contributions from the community. To contribute, please fork the repository and submit a pull request with your proposed changes.
1 change: 1 addition & 0 deletions compress.js
Original file line number Diff line number Diff line change
Expand Up @@ -30,5 +30,6 @@ archive.pipe(output);
archive.directory("src/admin/", "admin");
archive.directory("src/catalog/", "catalog");
archive.file("src/install.json", { name: "install.json" });
archive.file("src/installation.txt", { name: "installation.txt" });

archive.finalize();
34 changes: 17 additions & 17 deletions src/admin/view/template/module/ps_live_search.twig
Original file line number Diff line number Diff line change
Expand Up @@ -34,17 +34,17 @@
<div id="tab-general" class="tab-pane active">

<div class="row mb-3">
<label class="col-sm-2 col-form-label" for="input-status">{{ entry_status }}</label>
<label for="input-status" class="col-sm-2 col-form-label">{{ entry_status }}</label>
<div class="col-sm-10">
<div class="form-check form-switch form-switch-lg">
<input type="hidden" name="module_ps_live_search_status" value="0" />
<input type="checkbox" name="module_ps_live_search_status" value="1" class="form-check-input" {% if module_ps_live_search_status %} checked{% endif %} id="input-status" />
<input type="checkbox" name="module_ps_live_search_status" value="1" id="input-status" class="form-check-input" {% if module_ps_live_search_status %} checked{% endif %} />
</div>
</div>
</div>

<div class="row mb-3 required">
<label class="col-sm-2 col-form-label" for="input-input-delay">{{ entry_input_delay }}</label>
<label for="input-input-delay" class="col-sm-2 col-form-label">{{ entry_input_delay }}</label>
<div class="col-sm-10">
<input type="text" name="module_ps_live_search_input_delay" value="{{ module_ps_live_search_input_delay | default('100') }}" placeholder="{{ entry_input_delay }}" id="input-input-delay" class="form-control" />
<div id="error-input-input-delay" class="invalid-feedback"></div>
Expand All @@ -53,7 +53,7 @@
</div>

<div class="row mb-3 required">
<label class="col-sm-2 col-form-label" for="input-input-min-chars">{{ entry_input_min_chars }}</label>
<label for="input-input-min-chars" class="col-sm-2 col-form-label">{{ entry_input_min_chars }}</label>
<div class="col-sm-10">
<input type="text" name="module_ps_live_search_input_min_chars" value="{{ module_ps_live_search_input_min_chars | default('1') }}" placeholder="{{ entry_input_min_chars }}" id="input-input-min-chars" class="form-control" />
<div id="error-input-input-min-chars" class="invalid-feedback"></div>
Expand All @@ -65,7 +65,7 @@
<div id="tab-products" class="tab-pane">

<div class="row mb-3">
<label class="col-sm-2 col-form-label" for="input-product-status">{{ entry_product_status }}</label>
<label for="input-product-status" class="col-sm-2 col-form-label">{{ entry_product_status }}</label>
<div class="col-sm-10">
<div class="form-check form-switch form-switch-lg">
<input type="hidden" name="module_ps_live_search_product_status" value="0" />
Expand All @@ -75,7 +75,7 @@
</div>

<div class="row mb-3">
<label class="col-sm-2 col-form-label" for="input-product-description">{{ entry_product_description }}</label>
<label for="input-product-description" class="col-sm-2 col-form-label">{{ entry_product_description }}</label>
<div class="col-sm-10">
<div class="form-check form-switch form-switch-lg">
<input type="hidden" name="module_ps_live_search_product_description" value="0" />
Expand All @@ -85,7 +85,7 @@
</div>

<div class="row mb-3 required">
<label class="col-sm-2 col-form-label" for="input-product-description-length">{{ entry_product_description_length }}</label>
<label for="input-product-description-length" class="col-sm-2 col-form-label">{{ entry_product_description_length }}</label>
<div class="col-sm-10">
<input type="text" name="module_ps_live_search_product_description_length" value="{{ module_ps_live_search_product_description_length | default('200') }}" placeholder="{{ entry_product_description_length }}" id="input-product-description-length" class="form-control" />
<div id="error-input-product-description-length" class="invalid-feedback"></div>
Expand All @@ -94,7 +94,7 @@
</div>

<div class="row mb-3">
<label class="col-sm-2 col-form-label" for="input-product-image">{{ entry_product_image }}</label>
<label for="input-product-image" class="col-sm-2 col-form-label">{{ entry_product_image }}</label>
<div class="col-sm-10">
<div class="form-check form-switch form-switch-lg">
<input type="hidden" name="module_ps_live_search_product_image" value="0" />
Expand Down Expand Up @@ -123,21 +123,21 @@
<div id="tab-categories" class="tab-pane">

<div class="row mb-3">
<label class="col-sm-2 col-form-label" for="input-category-status">{{ entry_category_status }}</label>
<label for="input-category-status" class="col-sm-2 col-form-label">{{ entry_category_status }}</label>
<div class="col-sm-10">
<div class="form-check form-switch form-switch-lg">
<input type="hidden" name="module_ps_live_search_category_status" value="0" />
<input type="checkbox" name="module_ps_live_search_category_status" value="1" disabled class="form-check-input" {% if module_ps_live_search_category_status %} checked{% endif %} id="input-category-status" />
<input type="checkbox" name="module_ps_live_search_category_status" value="1" disabled id="input-category-status" class="form-check-input" {% if module_ps_live_search_category_status %} checked{% endif %} />
</div>
</div>
</div>

<div class="row mb-3">
<label class="col-sm-2 col-form-label" for="input-category-image">{{ entry_category_image }}</label>
<label for="input-category-image" class="col-sm-2 col-form-label">{{ entry_category_image }}</label>
<div class="col-sm-10">
<div class="form-check form-switch form-switch-lg">
<input type="hidden" name="module_ps_live_search_category_image" value="0" />
<input type="checkbox" name="module_ps_live_search_category_image" value="1" disabled class="form-check-input" {% if module_ps_live_search_category_image %} checked{% endif %} id="input-category-image" />
<input type="checkbox" name="module_ps_live_search_category_image" value="1" disabled id="input-category-image" class="form-check-input" {% if module_ps_live_search_category_image %} checked{% endif %} />
</div>
</div>
</div>
Expand All @@ -162,21 +162,21 @@
<div id="tab-manufacturers" class="tab-pane">

<div class="row mb-3">
<label class="col-sm-2 col-form-label" for="input-manufacturer-status">{{ entry_manufacturer_status }}</label>
<label for="input-manufacturer-status" class="col-sm-2 col-form-label">{{ entry_manufacturer_status }}</label>
<div class="col-sm-10">
<div class="form-check form-switch form-switch-lg">
<input type="hidden" name="module_ps_live_search_manufacturer_status" value="0" />
<input type="checkbox" name="module_ps_live_search_manufacturer_status" value="1" disabled class="form-check-input" {% if module_ps_live_search_manufacturer_status %} checked{% endif %} id="input-manufacturer-status" />
<input type="checkbox" name="module_ps_live_search_manufacturer_status" value="1" disabled id="input-manufacturer-status" class="form-check-input" {% if module_ps_live_search_manufacturer_status %} checked{% endif %} />
</div>
</div>
</div>

<div class="row mb-3">
<label class="col-sm-2 col-form-label" for="input-manufacturer-image">{{ entry_manufacturer_image }}</label>
<label for="input-manufacturer-image" class="col-sm-2 col-form-label">{{ entry_manufacturer_image }}</label>
<div class="col-sm-10">
<div class="form-check form-switch form-switch-lg">
<input type="hidden" name="module_ps_live_search_manufacturer_image" value="0" />
<input type="checkbox" name="module_ps_live_search_manufacturer_image" value="1" disabled class="form-check-input" {% if module_ps_live_search_manufacturer_image %} checked{% endif %} id="input-manufacturer-image" />
<input type="checkbox" name="module_ps_live_search_manufacturer_image" value="1" disabled id="input-manufacturer-image" class="form-check-input" {% if module_ps_live_search_manufacturer_image %} checked{% endif %} />
</div>
</div>
</div>
Expand All @@ -201,7 +201,7 @@
<div id="tab-informations" class="tab-pane">

<div class="row mb-3">
<label class="col-sm-2 col-form-label" for="input-information-status">{{ entry_information_status }}</label>
<label for="input-information-status" class="col-sm-2 col-form-label">{{ entry_information_status }}</label>
<div class="col-sm-10">
<div class="form-check form-switch form-switch-lg">
<input type="hidden" name="module_ps_live_search_information_status" value="0" />
Expand Down
Loading

0 comments on commit 52161d1

Please sign in to comment.