Updated OpenShift Deploy Buttons - Archived

Do you have sample or template applications for OpenShift that you’d like to share? In addition to submitting your application to OpenShift Hub, you can also take advantage of customizable OpenShift Deploy buttons or GitHub-style ribbons.

OpenShift Deploy Buttons

Creating Your Own

If you already have an application that can be used as an OpenShift Quickstart, you can use a URL query string to create a one-click deploy link. This link can be embedded in a button/ribbon as described below, or customized further as needed using OpenShift’s Web-Based App Creation Workflow URLs.

The following uses the OpenShift Launch Service Application as an example, which is a nodejs-0.10 application with the git URL https://github.com/ryanj/launch-service.git.

All you need to do to create the button is to insert a snippet of HTML or markdown to your web page:

<a href="https://openshift.redhat.com/app/console/application_type/custom?&cartridges[]=nodejs-0.10&initial_git_url=https://github.com/ryanj/launch-service.git&name=launch"><img alt="LAUNCH ON OpenShift" src="http://launch-shifter.rhcloud.com/launch/LAUNCH ON.svg" /></a>

Alternatively, in Markdown:

[![LAUNCH ON OpenShift](http://launch-shifter.rhcloud.com/launch/LAUNCH ON.svg)](https://openshift.redhat.com/app/console/application_type/custom?&cartridges[]=nodejs-0.10&initial_git_url=https://github.com/ryanj/launch-service.git&name=launch)

Try it out!

LAUNCH ON OpenShift

You can also use a light version of the button by changing the image source to http://launch-shifter.rhcloud.com/launch/light/LAUNCH ON.svg.

Learn more about how you can customize this URL using OpenShift’s Web-Based App Creation Workflow URLs.

Using the Launch Service

To make things even easier, we’ve created the OpenShift Launch Service, which will help you build and customize your buttons and provide you the approriate HTML/markdown needed to embed the button in your application.

Simply provide the Git repository URL, cartridge list, and button color/text, and start sharing your application today!

OpenShift Launch Service

Try the OpenShift Launch Service

OpenShift Deploy Ribbon

If you prefer to use a GitHub-style deploy ribbon to your application instead, you can use the following HTML/CSS:

<span id="fossribbon">
    <a href="https://openshift.redhat.com/app/console/application_types/custom?name=parks&initial_git_url=https%3A%2F%2Fgithub.com/ryanj/restify-postGIS.git&cartridges[]=nodejs-0.10&cartridges[]=postgresql-9.2">Run me on OpenShift</a>
</span>

Here is the CSS for the fossribbon span:

#fossribbon {
  z-index:10;
}
#fossribbon a{
  background:red;
  color:#fff;
  text-decoration:none;
  font-family:arial, sans-serif;
  text-align:center;
  font-weight:bold;
  padding:5px 40px;
  font-size:1rem;
  line-height:2rem;
  position:relative;
  transition:0.5s;
}
#fossribbon a:hover{
  background:black;
  color:#fff;
}
#fossribbon a::before,#fossribbon a::after{
  content:"";
  width:100%;
  display:block;
  position:absolute;
  top:1px;
  left:0;
  height:1px;
  background:#fff;
}
#fossribbon a::after{
  bottom:1px;top:auto;
}
@media screen and (min-width:800px){
  #fossribbon{
    position:absolute;
    display:block;
    top:0;
    right:0;
    width:200px;
    overflow:hidden;
    height:200px;
  }
  #fossribbon a{
    width:200px;
    position:absolute;
    top:60px;
    right:-60px;
    transform:rotate(45deg);
    -webkit-transform:rotate(45deg);
    box-shadow:4px 4px 10px rgba(0,0,0,0.8);
  }
}

The ribbon is automatically hidden on mobile, and other small-screen devices.

Ribbon Preview

Try it Out!

A live example of the GitHub-style ribbon can be seen at the National Parks sample app.

Related Content

Launching Applications with OpenShift’s Web-Based Workflow
Customizing OpenShift’s Web-based App Creation Workflow
OpenShift QuickStart Developers Guide
OpenShift Hub

Categories
News, OpenShift Online, Products
Tags
, , ,

2 Responses to “Updated OpenShift Deploy Buttons - Archived”

  1. Phus Lu

    Exciting feature!
    But I found that it does work for golang. It always failed when I use neither “go” nor “golang” for cartridges[]

Comments are closed.