Tools – Download Box Generator

Posted on March 14th, 2018, 1048 viewed

Usagilabs – Previously I apologize to you, because already a month I have not released a new article, because I am busy making safelink plugin for my blog. and amid my busyness in making the plugin. I set aside my time by creating a tool.

maybe this tool is no stranger to you who have visited my old blog that is Usagilabs, in that blog I ever released the tools download box shaped an application. I created from VB.NET. and the release this time a little different from before because I will share tools download box is in the form of an online generator that is in my pages.

this Generator Download Box support for wordpress theme and blogger theme, and this generator is responsive. which mean you can use this generator at device mobile

See Also :How to Create Download Box Using Plugin Meta Box
Easy Way To Make Back To Top Button Simple
Fanstrap v1.2 WordPress Themes

tools download box is still a trial stage (beta), and I hope you as a user of this tool. when found a bug on this tool please comment. I will fix as soon as I can and you can also request the feature (if I accept it) in the tools download box.

Tools Download Box for WordPress Theme & Blogger Theme

tools generator download box
Open Tools

Result

Log

v1.0 [14/3/18]
- Release generator
- Support Mobile Devices (Responsive)
- Download Box Responsive

Installation of CSS

Install CSS in WordPress Theme

1. Entered into style.css
2. Copy the code above and paste the code at the end of the line style.css
3. Click Update File

Install CSS in Blogger Theme

1. Sign in to Blogger
2. Your Blog > Theme > Edit HTML
3. Search code ]]></b:skin> or </style>
4. Put CSS below just above the code ]]></b:skin> or </style>
5. Save Theme

Style

for a you using someone else’s theme you need extra css to support with generator download box.

CSS Default

/* Yuukithemes - Download Box Default */
.download_area{padding:15px 10px;margin:10px auto;background:#f0f2f5;font-family:'Roboto','Open Sans',Arial,Sans-serif}
.download_item{box-shadow:0 1px 4px -1px #00000024;}
.download_item strong{background:#5ba1d0;display:block;padding:8px 12px;color:#fff;font-size:12px}
.download_item div{background:#fff;padding:5px;color:#d8d8d8;font-size:12px}
.download_item a{padding:0 7px;font-size:12px;color:#0176C9}
.download_item a:hover{text-decoration:underline}
.download_item del{color:#cc1f1f}

CSS Default 2 (Inset)

/* Yuukithemes - Download Box Default Inset */
.download_area{margin:10px auto;font-family:'Roboto','Open Sans',Arial,Sans-serif;}
.download_item strong{background:#5ba1d0;display:block;padding:8px 12px;color:#fff;font-size:12px}
.download_item div{background: #f2f4f9;padding:5px;color:#d8d8d8;font-size:12px;}
.download_item a{padding:0 7px;font-size:12px;color:#0176C9}
.download_item a:hover{text-decoration:underline}
.download_item del{color:#cc1f1f}

CSS Simply Border

/* Yuukithemes - Download Box Simply Border */
.download_area{margin:10px auto;font-family:'Roboto','Open Sans',Arial,Sans-serif;}
.download_area>div:last-child{padding-bottom:0}
.download_item{padding-bottom:14px;}
.download_item strong{border-left: 4px solid #5ba1d0;display:block;padding: 0 0 0 5px;color: #373D3F;font-size:12px;}
.download_item div{margin: 0 -5px;color:#d8d8d8;font-size:12px;}
.download_item a{padding:0 7px;font-size:12px;color:#0176C9}
.download_item a:hover{text-decoration:underline}
.download_item del{color:#cc1f1f}

Reference
I made this article not alone, I also glanced at some references to add my insight in making this article.
– https://translate.google.com
– https://photoscape.org
– http://konachan.net
– http://yuukithemes.com

Related Post

Please wait....
Disqus comment box is being loaded