Git Product home page Git Product logo

blogs's Introduction

Using custom badges

Badges are often a convenient utility to track the status of a project and if you want to add a badge showing your last build's status, Shippable provides its own api for bagdes. This api always returns default badge which will say run is shippable in case your run was successful.

This is something that you always not want. You may like to have a custom badge of your choice which will display the label and color that you want. For example: You would like to display a badge for a specific branch with the branch name and its status in the badge itself.

This is possible by using shields.io. Shields.io provides an api that will generate a badge with the text of your choice for a given projectId. You will need to pass the projectId and few query parameters to get your own badge.Here is how your url might look like.

https://img.shields.io/shippable/:projectId/:branch.svg?field1=value1&field2=value2&field3=value3

Note You can get the projectId from your project page on shippable.

Following are the various fields that you can use to get your custom badge.

Field Purpose Default Value
label left text in badge run
colarA left side color in badge #555555`
successLabel label when build is passing shippable
successColor color when build is passing #44CC11
failLabel label when build is failing failing
failColor color when build is failing #DC5F59
cancelledLabel label when build is cancelled cancelled
cancelledColor color when build is cancelled #6BAFBD
unstableLabel label when build is unstable unstable
unstableColor color when build is unstable #CEA61B
pendingLabel label when build is pending pending
pendingColor color when build is pending #5183A0
skippedLabel label when build is skipped skipped
skippedColor color when build is skipped #F8A97D
noBuildLabel label when there is no build none
noBuildColor color when there is no build #A1ABAB
inaccessibleLabel label when Shippable API is inaccessible inaccessible
inaccessibleColor color when Shippable API is inaccessible #A1ABAB

Note: Since # is an special character, you need to encode it while passing in the url. To encode it use %23, for example to pass the color #FF0000 you need to use label=%23FF0000

  • Below is an example of how you can generate a bagde with label as My label, color set to "#000" success label set to Success label " and success color set to #3128C7E.
URL : https://img.shields.io/shippable/54ee15335ab6cc13528dd1ef.svg?label=My%20label&successLabel=Success%20label&colorA=%23000&successColor=%23128C7E

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo 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.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.