Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add banner image to WordPress plugin directory #10

Closed
westonruter opened this issue Sep 12, 2013 · 15 comments · Fixed by #11
Closed

Add banner image to WordPress plugin directory #10

westonruter opened this issue Sep 12, 2013 · 15 comments · Fixed by #11

Comments

@westonruter
Copy link
Contributor

Via FAQ:

How do I make one of those cool banners for my plugin page?
Start by creating an assets/ directory in the root of your SVN checkout. This will be on the same level as tags/ and trunk/, for example.

Inside that assets/ directory, you can make a file named "banner-772x250.png" or "banner-772x250.jpg". The image must be exactly 772 pixels wide and 250 pixels tall. No GIFs.

To support high-DPI (aka "retina") displays, you can additionally make a file named "banner-1544x500.png" or "banner-1544x500.jpg". The image must be exactly 1544 pixels wide and 500 pixels tall. No GIFs. This image, if present, will only be served when the website detects that the viewing browser is on a high-DPI display. Read this feature's announcement post for more details and special notes about creating this image.

After you check in your new banner(s), it will appear the next time the plugin refreshes itself in the directory. This may take a few minutes.

For development and testing, you can add a URL parameter to your plugin's URL of "?banner_url=A_LINK_TO_YOUR_IMAGE" to preview what the page will look like with your own image. This will only work with your own plugins, you can not use this parameter on anybody else's plugins.

@johnregan3
Copy link
Contributor

@westonruter Here is a first draft on the banner image (just the 772x250 for now):

banner-772x250

@westonruter
Copy link
Contributor Author

@johnregan3 great! Suggestion: could you make the window narrower so that the customizer form appears alongside the widget in the sidebar? I used twentytwelve in the screenshots I made, and with resizing the widget of the window it was easy to get the sidebar and the customizer control to appear side-by-side.

@johnregan3
Copy link
Contributor

@westonruter Here's a different version based on your input:

banner-772x250

@westonruter
Copy link
Contributor Author

Looks good! What about adding some arrow overlay to indicate that the panel in the left will affect the preview on the right? A rough idea:

pasted_image_9_12_13_12_47_pm

@johnregan3
Copy link
Contributor

@westonruter Sounds good. It gives a visual cue as to what's going on.

banner-772x250

@johnregan3
Copy link
Contributor

@westonruter Here's one with some color:

banner-772x250-bl

@westonruter
Copy link
Contributor Author

@johnregan3 Looks really good! I like the color. Only other suggestion I would have is to make the arrow swoop down and then go up to the widget in the sidebar, you know to fill up some of the empty space in the banner.

@johnregan3
Copy link
Contributor

@westonruter I see what you're saying.

banner-772x250-bl

@westonruter
Copy link
Contributor Author

There we go. Make it so!

@westonruter
Copy link
Contributor Author

@johnregan3 would you mind updating the banner image now to showcase the new collapsable UI you added, and maybe the new drag-and-drop reordering of widgets in the customizer section?

@johnregan3
Copy link
Contributor

@westonruter I can do that!

@johnregan3
Copy link
Contributor

Starting Point:
banner-772x250

@westonruter
Copy link
Contributor Author

@johnregan3 Great! Love the visualization of the drag-and-drop.

  • I think we can drop the bullet pointed text overlay, as it is obscuring an important company logo 😉
  • Could you expand one of the widget controls to show what is inside?
  • Maybe use another widget than a second Text widget instance.

Other than that, good to go!

@johnregan3
Copy link
Contributor

@westonruter Ver 2:
banner-772x250

@westonruter
Copy link
Contributor Author

💥 commit!

fnakstad added a commit to knishiura-lab/wp-widget-customizer that referenced this issue Feb 5, 2014
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants