API Connect

API Connect

Join this online group to communicate across IBM product users and experts by sharing advice and best practices with peers and staying up to date regarding product enhancements.

 View Only
  • 1.  Customizing API Display in API Connect Developer Portal

    Posted Fri February 14, 2025 10:04 AM
      |   view attached

    Hello IBM Community,
    We are looking to customize the API display section in our IBM API Connect Developer Portal to enhance the UI/UX and showcase APIs in a more structured manner. However, we do not have an exact idea of how to customize it. We would appreciate guidance on the available customization options, theming and branding using CSS, JavaScript, or Liquid templates, and best practices for improving API display. Additionally, insights on leveraging custom widgets, content types, or Drupal modules for enhancing the portal's layout would be helpful.
    We have attached a screenshot as a reference to illustrate how we want the APIs to be customized. Any documentation, examples, or best practices to help achieve this customization would be highly valuable.



    ------------------------------
    Prathamesh Shinde
    ------------------------------


  • 2.  RE: Customizing API Display in API Connect Developer Portal

    Posted Fri February 14, 2025 10:20 AM
    Edited by Jinan Kordab Tue February 18, 2025 05:10 PM
    Hello,
    I was able to modify the CSS by using official technique on IBM Documentation by downloading SubTheme, then modifying the override.css with my own styles, then uploading the new theme.
    Thank you,



    ------------------------------
    Jinan Kordab
    ------------------------------



  • 3.  RE: Customizing API Display in API Connect Developer Portal

    Posted Mon February 17, 2025 02:53 AM

    Hiya

    Just to add to what's been said in this thread already, the API rendering section is not done by native Drupal code. It's done by a reactjs application called apiconnect-explorer. It is also used in API Manager, Consumer Catalog, AppConnect, CP4i, Tivoli, etc..

    I am afraid you can't customise the output of that reactjs application, you can obviously apply custom SCSS on top though.

    If you have UX improvements you'd like us to make to the code out of the box (that would benefit everyone) then please do let me know!

    Cheers

    Chris



    ------------------------------
    Chris Dudley
    ------------------------------