Possible to add external link on pn.Card header?

I want to click on the card header and head to a new link:

import panel as pn
pn.Card(header='<a href="https://www.w3schools.com">Visit W3Schools.com!</a>')
1 Like

It seems to “work” but you will have to work on the styling :slight_smile:

import panel as pn
card1=pn.Card(
    header='<a href="https://www.w3schools.com">Visit W3Schools.com!</a>'
)
card2=pn.Card(
    header='[Visit W3Schools.com!](https://www.w3schools.com)'
)
app=pn.Column(card1, card2)
app.servable()
1 Like

Hi @Marc is it possible to combine between pn.Card and accordion?

1 Like

Sorry. I don’t understand your question. Could you make it more specific?

Hi @Marc , I mean like we want to make drop down navigation menu so I think if we can combine between pn.accordion with pn.card would be great to make that navigation menu.

I try and it works:

import panel as pn
from panel import HSpacer, Spacer

pn.extension('tabulator','vega', 'plotly','echarts',template='fast')
card1=pn.Card(
    header='<a href="https://www.w3schools.com">Visit W3Schools.com!</a>'
)
card2=pn.Card(
    header='[Visit W3Schools.com!](https://www.w3schools.com)'
)
app=pn.Column(card1, card2)

accordion1 = pn.Accordion(('Menu', app),header_background='green',active_header_background='red',header_color='white')
accordion1

image