[downloads] improvements

[rubengc]

trafficstars

Some missing features I think that could work to make a bit more powerfull [downloads] look

1 - Centered download image Commonly product's featured images are jpg/png images with square dimensions (1:1), on mobiles/tablets edd uses a 100% of width on products lists so you will need add custom rules to center them and for sure you will want images centered on large screen too

Almost I need to add this rule on all my edd installations, so why not add It as default alignment?

2 - View more button Some times you will not want to add the buy button on products lists, this happens normally If you are selling multiple price options of your products so the addition of a view more button with the link to the current download could save you some time

This button is similar to the "More Information" button that you can see on EDD Page

3 - Some customizer controls to customize [downloads] look Some controls like background/text color could be awesome to be added in Themedd, just to bring more features focused on EDD

[arraypress]

Ruben,

Can you post a screenshot example of what you mean in 1? Not understanding your idea with this one.

The other suggestions are already in my forked theme, so it's possibly to create any type of colour scheme.

Sent from my iPhone

On 20 Aug 2017, at 16:07, rubengc [email protected] wrote:

Some missing features I think that could work to make a bit more powerfull [downloads] look

1 - Centered download image Commonly product's featured images are jpg/png images with square dimensions (1:1), on mobiles/tablets edd uses a 100% of width on products lists so you will need add custom rules to center them and for sure you will want images centered on large screen too

Almost I need to add this rule on all my edd installations, so why not add It as default alignment?

2 - View more button Some times you will not want to add the buy button on products lists, this happens normally If you are selling multiple price options of your products so the addition of a view more button with the link to the current download could save you some time

This button is similar to the "More Information" button that you can see on EDD Page

3 - Some customizer controls to customize [downloads] look Some controls like background/text color could be awesome to be added in Themedd, just to bring more features focused on EDD

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub, or mute the thread.

[rubengc]

Yes David

To check It simply add a download with a small featured image (50x50) you will see quickly the need to center It on lista

Also I think there are a spacing issue, themedd applies a padding yo the download inner element

If you try yo add a background to the downloads (like vendd) you will notice about all the downloads list will have this background instead to apply It to everyone

So spacing here should be divided between the download container (.edd_download) and the download inner element (.edd_download .edd_download_inner)

[arraypress]

@rubengc, I countered this issue by switching the padding to margin and then added some internal padding to the edd_download_inner to give it the desired look. Centering the images isn't a bad idea, but i can't see many instances where someone would chose to use a 50x50px featured image. Regardless, easy enough to add to the theme.

Will check out the spacing issue and report back, though I believe some negative margins are used on the .edd_download container if I remember right?

[amdrew]

Some times you will not want to add the buy button on products lists, this happens normally If you are selling multiple price options of your products so the addition of a view more button with the link to the current download could save you some time

Love the idea but probably not something that will be included in Themedd out of the box. Something like this can be added easily enough by those that need it.

To check It simply add a download with a small featured image (50x50) you will see quickly the need to center It on lista

I agree with David, it's easier to center the images if you need to, in the case that your download images are small. I actually think it looks better left-aligned, like the download title and content. Centering small images looks kinda strange.

So spacing here should be divided between the download container (.edd_download) and the download inner element (.edd_download .edd_download_inner)

Adding margin or padding to the parent download element (.edd_download) isn't a good idea with flexbox, you'll quickly run into calculation issues (in my experience). That's why there is padding on the inner div. It's also easy enough to change this to margin if need be, it all depends on what you're trying to accomplish.

Will check out the spacing issue and report back, though I believe some negative margins are used on the .edd_download container if I remember right?

Yes there is, so the download grid "lines" up with navigation and everything else, making it more aesthetically pleasing.

[arraypress]

@amdrew, would it cause any issues to have margin on the .edd_download_inner using flexbox? Still getting used to flexbox, so wanted to confirm any issues with using padding/margins on the grid.

[amdrew]

It should be perfectly fine

[rubengc]

For the view more button I just added a new plugin to solve this need: https://wordpress.org/plugins/edd-view-more/

And I just added a new one to add actions (basically links) to a download, so you could add a direct link to a zip file for example: https://wordpress.org/plugins/edd-download-actions/

I continue thinking that add a specific controls to customize [downloads] look (like item background color or text colors) will be a great addition

And about centering images, well you have one of my own sites as example: https://tsunoa.com/

If you disable the centering rules, you will see how horrible it looks, as well as EDD team sites (EDD and AffilliateWP) has images centered or at least an svg with a background and the icon centered

Also themedd preview shows a book placeholder centered so...

Anyway I just checked how to center it (horizontally and vertically):

.edd_download_image {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
}

And with a negative margin anyone could make the image completely full width inside the download inner:

.edd_download_image {
        margin: -1.5rem -1.5rem 1rem;
}