Comments (5)
@NeOMakinG I have this coded in one of my client's shops using display: grid. We can take inspiration. See https://eshop.agrola.cz/
Two things:
- What if we made this universal, so it's not limited to categories and anybody could put any links in there?
- Can we make it not limited 3 element layout, so anybody can use as many items as they want? So we can have more rich grids like here? https://www.cycli.cz/
- We will need to create a new module for this. Can you create a repo for it? Should be called something like ps_homebanner or something like this.
from hummingbird.
@Hlavtox I see you went with background and cover in your project. IMO not the best choice for category images. To improve SEO I would use <img> and object-fit: cover
.
Besides this is tricky to implement this way (1 / 2). For example if there's 4 categories it would have to be 2 / 2 or 1 big / 3 small. This would require all categories to have big thumbnails generated. Since this is just default theme then maybe it would be best to make it simple with all categories equal in size. Unless it's going to be something like themeconfigurator module in PS 1.6 where you would upload custom images for each item, without using generated thumbnails.
from hummingbird.
@SharakPL Yes, it would be better to use the img tag for better control. ;) Honestly, I learned about object-fit not long ago, thats why I didnt use it.
I would let the user to upload a custom photo and set a custom link for each of the blocks, so they can put a link to CMS or whatever they want.
from hummingbird.
@PrestaShop/product-team, This thing is a complete new part, should it be a module? Like the slider?
from hummingbird.
IMO category images should be generated like now. One improvement is required though: if there is a category miniature set, then changing main category image shouldn't change the miniature. It should only generate miniature from main image if the miniature is empty.
Adding custom image/text/link/html can be placed on any hook, should be in separate module.
from hummingbird.
Related Issues (20)
- In the Search results page, it is missing the search bar when there's no result
- Can not install on Node v14 HOT 3
- Build command fails if there is no .env file with a wrong message HOT 1
- Flag indicating the use of a new version of Bootstrap for developers HOT 1
- Incorporate improvements for user authentication forms HOT 5
- Move "order summary" in payment step above the payment method selection
- Carrier extra content not visible when changing between order steps from "header" HOT 3
- hummingbird - In Checkout process, Personal Information tab, wording in incorrect HOT 22
- Only the first wishlist is clickable in humingbird theme HOT 5
- Release v0.1.7 HOT 2
- Replace "else if" smarty conditions by "elseif" as officially recommanded HOT 5
- The Min quantity config is always preselected regardless of the quantity in the cart
- In Order details page - If my product has a downloadable file, I can't download it
- In Shopping cart - If you check the Customized button, there's a warning HOT 6
- Incorrect URL redirection when using browser back button HOT 5
- Guest checkout: Use different invoice address : Can't order
- In product page - The Add to cart button is greyed out when I change quantity to 0 and back to a positive quantity
- Product page - Product price with a volume discount is incorrect until I add the product to my cart
- Tags are not displayed on product details page, quick view and product listing page when product has no image HOT 1
- missing types for `window.prestashop`
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from hummingbird.