RxGo widget

The RxGo Widget allows you to seamlessly integrate RxGo prescription drug pricing, discounts, and coupon printing functionality into your website.

The RxGo Widget leverages modern web technologies to simplify integration and customize the widget's appearance to match the unique style of your site.

Overview

The RxGo website provides information on prescription drug pricing, enabling you to find the best prices with discounts and create personalized coupons.

RxGo has long provided an API to its partners, enabling them to integrate RxGo functionality into their own websites.

While the API allows for flexible and secure integrations to meet various demands, it requires development skills and a significant time investment to implement.

To address the need for easier integration of RxGo functionality without requiring technical skills, the RxGo Widget utilizes modern technologies based on Web Components and the Lit framework. It offers a simple, secure, and customizable solution for integrating RxGo drug search, pricing, and discount lookups into websites built on different architectures, including single-page applications, content management systems, static and dynamic sites, and utilizing various back-end and front-end frameworks and programming languages.

Getting Started

To get started with the RxGo Widget, follow these steps:

1. Add the following snippet to the section of your web page to include the RxGo widget code located on the public CDN:

   <script
     type="module"
      src="https://unpkg.com/@rxgo/rxgo-widget/dist/rxgo-widget.bundled.js"
   ></script>

2. Place the <rxgo-widget drugname="adderall"></rxgo-widget> element anywhere within the <body> section of your HTML page. You may also need to add some attributes to configure the element's appearance and behavior. For more details on the supported attributes, refer to the RxGo Widget Guide.

3. Optionally, you can customize the colors of the RxGo widget to match your site's color scheme by adding CSS variables to your CSS stylesheet or <style> tag. Here's an example:

   <style>
     :root {
       --button-color: 255, 108, 0;
       --button-text-color: #ffffff;
       --price-header-text-color: #ffffff;
       --price-header-color: #000000;
       --price-color: #e7f4ff;
       --price-border-color: #59b9c4;
       --dosage-color: #312f2f;
       --arrow-top-text-color: #ffffff;
       --arrow-top-color: #53cabc;
       --arrow-bottom-text-color: #ffffff;
       --arrow-bottom-color: #30006b;
     }
   </style>

Feel free to adjust the values of the CSS variables to match your desired colors.

For your convenience, we have provided an interactive customization page where you can easily change colors and instantly preview how they will look in the widget. Once you have customized the colors to your satisfaction, you can simply copy the code snippet with the custom CSS variables and paste it into your CSS stylesheet.