{ Community }
  • Academy
  • Docs
  • Developers
  • Resources
    • Community Articles
    • Apigee on GitHub
    • Code Samples
    • Videos & eBooks
    • Accelerator Methodology
  • Support
  • Ask a Question
  • Spaces
    • Product Announcements
    • General
    • Edge/API Management
    • Developer Portal (Drupal-based)
    • Developer Portal (Integrated)
    • API Design
    • APIM on Istio
    • Extensions
    • Business of APIs
    • Academy/Certification
    • Adapter for Envoy
    • Analytics
    • Events
    • Hybrid
    • Integration (AWS, PCF, Etc.)
    • Microgateway
    • Monetization
    • Private Cloud Deployment
    • 日本語コミュニティ
    • Insights
    • IoT Apigee Link
    • BaaS/Usergrid
    • BaaS Transition/Migration
    • Apigee-127
    • New Customers
    • Topics
    • Questions
    • Articles
    • Ideas
    • Articles
    • Ideas
    • Leaderboard
    • Badges
  • Log in
  • Sign up

Get answers, ideas, and support from the Apigee Community

  • Home /
  • Developer Portal (Drupal-based) /
avatar image
1

Customising Look & Feel of Apigee Developer Portal Home Page  

  • Export to PDF
Anil Sagar @ Google   created · May 03, 2015 at 06:00 AM · 2k Views · edited · May 03, 2015 at 07:31 AM

Hello All,

Very frequently we have heard this from many Apigee community members on how to customise Apigee Developer Portal and change look & feel. I believe putting all things in one article will help lot of them. Let's see various scenarios related to this particular task.

Use Case 1 : You have got your Free Apigee Developer Portal

  • Make sure you have Administrator Access to Developer Portal. You can verify this by logging into developer portal and look out for Administrator Menu on top of screen. See screenshot below for example.

  • Lot of things are straight forward but some needs to be hacked via unusual way. Reason behind this is free customers do not have code base access of the portal. We do not suggest some of the ways for production portal. For POC (Proof of Concept) they work great :-)

Scenario 1 - Change Header, Footer, Buttons, Menu Colors, Upload new Logo, Add Menu Links:

  • You can refer detailed documentation in our Apigee Docs which explains how to change these colors using an admin configuration screen.

Scenario 2 - Remove Recent Blogs, Forum Discussion Blocks from Home Page :

  • Blocks in home page are enabled using Drupal Context module. You can able to remove or add new blocks using configurations screens provided by Context module. Let's see how to remove these blocks from home page.
  • Navigate to Structure -> Context page to see list of contexts using admin menu. You will see screen like below.

  • Click on Edit link next to home context. You are navigate to screen where home page related contextual actions can be managed. Click on Blocks to see list of Block Activated. Click on remove icon next to block to remove them. You can also drag and drop new blocks from blocks list on right side.

See screenshot here.

  • Click on Save button at bottom of page once you are done with your changes.
  • Navigate to home page to see changes. See screenshot below where i have remove all the blocks from context home.

See screenshot here.

Scenario 3 - Remove Welcome to Text from Home Page :

  • Ideal way of doing this is changing the html using template files inside your theme. Unfortunately, this is not possible for free Apigee Developer Portals. If you are paid customer, you can able to do this by changing the theme template files by accessing code base.
  • For free customers, there is a way to remove this text by using css.
  • Create a new block by navigating to Structure > Blocks -> Add Block
  • Switch off Rich Text Editor under block body and make sure text format is 'FULL HTML'.
  • Write your css inside body using style tags, save the block and Enable the block in home page only.
  • You can either use block settings to display block in a particular page or use Context way of displaying blocks as explained above.

See settings here in screenshot.

See results here after removing home page welcome text from home page.

Similarly you can add additional css to any page. If you are paid customer and have access to code base then you write css inside your theme css files.

Cheers,

Anil Sagar

apigee-admin-menu.png (120.2 kB)
admin-context.png (123.8 kB)
thub.nodes.view.add-new-comment
Portal - Drupalcustom style
Add comment Show 3
10 |5000 characters needed characters left characters exceeded
▼
  • Viewable by all users
  • Viewable by Apigeeks only
  • Viewable by the original poster
  • Viewable by moderators
  • Viewable by moderators and the original poster
  • Advanced visibility
Viewable by all users
avatar image Dhwani Trivedi · May 14, 2015 at 05:09 PM 0
Link

Thank you @asagar & @Birute Awasthi ! :-)

avatar image Charlie Melega · Oct 27, 2020 at 06:34 PM 0
Link

I am looking to do many of the things suggested in this article. Is there an updated Customising Look & Feel of Apigee Developer Portal Home Page article that reflects the current Apigee Edge UI? As an example, I do not see a Structure tab or option available under the Admin tab. Thanks for any help.

Charlie

avatar image Chris Novak ♦ Charlie Melega · Oct 27, 2020 at 07:04 PM 0
Link

There is documentation on Drupal.org for our Kickstart distribution that explains how to make changes to the look and feel.

Article

Contributors

avatar image avatar image

Follow this article

9 People are following this .

avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image

Navigation

Customising Look & Feel of Apigee Developer Portal Home Page

Related Articles

Tutorial: allowing sign-in to the Apigee Edge (Drupal-based) Developer Portal using OpenID Connect

Apigee Developer Portal - Go Live Check List

Installing Developer Portal Multi Datacenter Version:4.17.xx and higher

Content Access Control on Developer Portal SmartDocs Documentation

Documenting SOAP APIs on Devportal using the WSDL Docs Module - New Release

How to push the changes from DEV environment to Staging or Production for an On-Prem Developer Portal

Documenting SOAP APIs on Devportal using the WSDL Docs Module

Using the Drupal Rules module to add intelligence to an Apigee Edge Developer Portal

Apigee DevPortal Drupal 8 distribution

Content Access Control on Developer Portal using Taxonomy Access Control

  • Products
    • Edge - APIs
    • Insights - Big Data
    • Plans
  • Developers
    • Overview
    • Documentation
  • Resources
    • Overview
    • Blog
    • Apigee Institute
    • Academy
    • Documentation
  • Company
    • Overview
    • Press
    • Customers
    • Partners
    • Team
    • Events
    • Careers
    • Contact Us
  • Support
    • Support Overview
    • Documentation
    • Status
    • Edge Support Portal
    • Privacy Policy
    • Terms & Conditions
© 2021 Apigee Corp. All rights reserved. - Apigee Community Terms of Use - Powered by AnswerHub
  • Anonymous
  • Sign in
  • Create
  • Ask a question
  • Create an article
  • Post an idea
  • Create an article
  • Post an idea
  • Spaces
  • Product Announcements
  • General
  • Edge/API Management
  • Developer Portal (Drupal-based)
  • Developer Portal (Integrated)
  • API Design
  • APIM on Istio
  • Extensions
  • Business of APIs
  • Academy/Certification
  • Adapter for Envoy
  • Analytics
  • Events
  • Hybrid
  • Integration (AWS, PCF, Etc.)
  • Microgateway
  • Monetization
  • Private Cloud Deployment
  • 日本語コミュニティ
  • Insights
  • IoT Apigee Link
  • BaaS/Usergrid
  • BaaS Transition/Migration
  • Apigee-127
  • New Customers
  • Explore
  • Topics
  • Questions
  • Articles
  • Ideas
  • Articles
  • Ideas
  • Badges