Default (Left Aligned)

Center Aligned

Right Aligned

Inverted Portrait

View this page on a mobile device to see the sponsored text and title change locations. This configuration does not affect desktop users.

Non-Sponsored

Omitting the sponsor prop will remove the sponsored label and sponsor logo.

                                                
                                                import BpkGraphicPromo from '@skyscanner/backpack-web/bpk-component-graphic-promotion';
                                                
                                                export default () => (
                                                  <BpkGraphicPromo
                                                    buttonText="Learn more"
                                                    contentId="graphic-promo-1"
                                                    headline="Ride your wave"
                                                    invertVertically
                                                    onClick={() => redirect("https://www.sponsor-name.com/promotion")}
                                                    sponsor={{
                                                      label: 'Sponsored',
                                                      logo: './path/to/sponsor/logo.png',
                                                      altText: 'Sponsor Name',
                                                    }}
                                                    subheading="Portugal and 6 more countries have just been added to the UK travel green list"
                                                    tagline="Tagline"
                                                    textAlign={TEXT_ALIGN.start}
                                                  />
                                                );

Props