Skip to main content
CivicGate

Embeddable widgets

Every widget below is a live, self-contained view of CivicGate data. Copy the <iframe>, paste it into your page, done. Most need no key and no account. Widgets are neutral and always link back to the source data.

How to embed

Two ways, same widgets. Pick one.

1 — iframe (no JavaScript)

Every widget has a URL under /embed/…. Point an iframe at it. Options are query parameters or path segments, documented per widget below.

<iframe src="https://www.civicgate.org/embed/funding-map" width="100%" height="520" style="border:0" loading="lazy" title="CivicGate widget"></iframe>

2 — script bundle (inline, no iframe)

The widget bundle mounts the same widgets directly into your page, so they inherit your layout and fonts. One script, one configure(), and a marker element per widget.

<script src="https://www.civicgate.org/civicgate-widget.js" defer></script>
<script>
  CivicGate.configure({ apiKey: "cg_live_…" });   // only needed for a following feed
</script>

<!-- one bill's public wall — no key needed -->
<div data-civicgate-widget="subject" data-subject-type="bill" data-subject-id="hr-22-119"></div>
Script bundle: markers & attributes

Configure once; every marker on the page mounts itself. CivicGate.configure({ apiKey, gatewayUrl }) may be called before or after the bundle loads — both re-scan the document.

MarkerAttributesWhat it renders
data-civicgate-widget="feed" data-limit (default 10), data-mode (manual | auto) The configured account's following feed. Needs an API key.
data-civicgate-widget="subject" data-subject-type (default bill), data-subject-id (required), data-limit (default 5) One subject's public wall. No key needed.
data-civicgate-widget="politician" data-id — a Bioguide id A compact member summary card. No key needed.

Per-element overrides: data-civicgate-key and data-civicgate-gateway beat the global configure() for that one widget.

Sizing: iframes need an explicit height (they cannot size themselves cross-origin). The heights in each snippet below are sensible starting points — adjust to taste, or use the script bundle, which grows with its content.

Federal funding map

US states shaded by federal dollars landing in each (place of performance). Hover for totals; click through to the state.

Parameters — none

This widget takes no parameters.

<iframe src="https://www.civicgate.org/embed/funding-map" width="100%" height="520" style="border:0" loading="lazy" title="CivicGate widget"></iframe>
Live preview

In-state funding by district

One state's congressional districts shaded by federal dollars landing in each.

Parameters (1)
ParameterAccepted valuesDefaultWhat it does
…/<state> Any 2-letter USPS state code (CA, TX, NY, …). Case-insensitive. — (required) Path segment, not a query parameter. Selects the state whose districts are drawn.
Examples (2)
  • Texas 
    https://www.civicgate.org/embed/district-funding/TX
  • New York 
    https://www.civicgate.org/embed/district-funding/ny

    Lower case works — the code is upper-cased server-side.

<iframe src="https://www.civicgate.org/embed/district-funding/CA" width="100%" height="480" style="border:0" loading="lazy" title="CivicGate widget"></iframe>
Live preview

Member connections graph

A member of Congress at the center of their co-sponsors, committees, and PAC support.

Parameters (1)
ParameterAccepted valuesDefaultWhat it does
…/<bioguideId> A Bioguide id (e.g. S000148). Find it in the URL of any /people page. — (required) Path segment. Selects the member at the center of the graph.
Examples (1)
  • Chuck Schumer 
    https://www.civicgate.org/embed/network/S000148
<iframe src="https://www.civicgate.org/embed/network/S000148" width="100%" height="560" style="border:0" loading="lazy" title="CivicGate widget"></iframe>
Live preview

Feed

CivicGate's activity feed, in either of two modes: a FOLLOWING feed (every update from every subject one account subscribes to) or a SUBJECT WALL (one bill's, person's, or member's updates, public to everyone).

Keys. A subject wall is public and needs none. A following feed shows one account's subscriptions, so it needs that account's read-only key — create one under Account → API keys, then append ?key=cg_live_…. Keys can never write to your account — see API keys.

Parameters (6)
ParameterAccepted valuesDefaultWhat it does
subject <type>:<id> — e.g. user:8f3c…, bill:hr-22-119, person:S000148. Types are listed under “Subject types” below. none SUBJECT WALL mode. Shows one subject's public updates. Needs no key. Always read-only. Takes precedence over key.
key A read-only API key (cg_live_…). none FOLLOWING FEED mode. Shows the updates of everything THAT account subscribes to. Create one under Account → API keys.
limit 1–50 (out-of-range values are clamped). 10 How many updates load per page.
mode manual | auto manual manual shows a “Load more” button; auto loads the next page as the reader nears the end (infinite scroll).
filters 1 | 0 0 Show the subject-group filter chips (People / Bills / Users / Civic). Following-feed mode only — a wall has one subject, so there is nothing to filter.
title Any text. empty (no heading) Heading rendered above the list. Embeds usually supply their own heading, so the default is none.
Examples (3)
  • A member's public wall — no key needed 
    https://www.civicgate.org/embed/feed?subject=user:8f3c1d2e-0000-0000-0000-000000000000&limit=15

    Replace the id with a real user id — it is in the URL of /user/<handle> once resolved, and in the API as PersonProfile-style userId.

  • One bill's wall, infinite scroll 
    https://www.civicgate.org/embed/feed?subject=bill:hr-22-119&mode=auto
  • Your own following feed, with filters 
    https://www.civicgate.org/embed/feed?key=cg_live_xxx&filters=1&limit=20&title=My%20feed
Notes (2)
  • A subject wall is public data and takes no credential. Do not pass a key with subject — the widget ignores it, deliberately, so a public wall can never spend someone's rate limit.
  • API keys are read-only: the gateway rejects every mutation on a key-authenticated request, so a key pasted into a public page cannot write to the account it belongs to. You can also restrict a key to specific origins.
<iframe src="https://www.civicgate.org/embed/feed" width="100%" height="520" style="border:0" loading="lazy" title="CivicGate widget"></iframe>

No live preview: this widget needs either your own API key or a real subject id, so any example here would be broken for everyone but its author.

Reference: subject types & event types

Valid values for the feed widget's subject parameter, and the kinds of update a wall can carry.

Subject types (16)

Use as subject=<type>:<id>. The id is the one in that entity's CivicGate URL — except for user, where it is the stable user id, never the handle.

TypeGroupWhat it isExample id source
person people Member of Congress /people/<id>
official people Official /official/<id>
governor people Governor /governor/<id>
president people President /president/<id>
judge people Judge /judge/<id>
state_legislator people State legislator /people/<id>
appointee people Appointee /official/<id>
candidate people Candidate /people/<id>
bill bills Federal bill /bill/<id>
state_bill bills State bill /state-bill/<id>
user users User /user/<id>
post users Post /post/<id>
issue civic Issue /issue/<id>
committee civic Committee /committees/<id>
election civic Election /elections/<id>
policy_area civic Policy area /bills?policyArea=%3Cid%3E
Subject groups (4)

The filter chips shown when filters=1. Each selects every subject type in its group.

  • people — People: person, official, governor, president, judge, state_legislator, appointee, candidate
  • bills — Bills: bill, state_bill
  • users — Users: user, post
  • civic — Civic: issue, committee, election, policy_area
Event types (31)

Every kind of update that can appear in a feed or on a wall. A subject only ever carries the events listed against it.

EventApplies toWhat it means
sponsored_bill person This person introduced a bill as primary sponsor.
member_vote person This person cast a recorded floor vote.
stock_trade person This person reported a stock trade.
position_conflict person A documented conflict between this person's money and their vote.
person_fact personofficialgovernorstate_legislator A new sourced background fact was added for this person.
role_change personofficialgovernorappointeepresidentstate_legislator This person started, ended, or changed an office.
donation person A newly disclosed contribution to this person.
state_sponsored_bill state_legislator This state legislator sponsored a bill.
judicial_ruling judge This judge published an opinion.
bill_status bill This bill moved to a new status.
bill_action bill A new legislative action was recorded on this bill.
bill_text bill New or updated full text was published for this bill.
bill_vote bill A roll-call vote was held on this bill.
state_bill_action state_bill A new action was recorded on this state bill.
state_bill_text state_bill New text was published for this state bill.
user_post user This user posted to their wall.
user_status user This user posted a short status update.
user_profile user This user updated their public profile.
user_content user This user shared something from CivicGate.
post_reply postuser Someone replied to this post.
post_media post Media finished uploading to this post.
issue_bill issue A bill was tagged to this issue.
policy_area_bill policy_area A new bill was filed under this policy area.
committee_bill committee A bill was referred to this committee.
hearing_scheduled committee This committee scheduled a hearing, markup or business meeting.
hearing_held committee This committee held a hearing, markup or business meeting.
committee_vote committeebillperson A recorded vote was held in committee — an amendment, a motion to report, a subpoena.
hearing_transcript committee A transcript became available for this proceeding.
hearing_testimony personofficialgovernorjudgeappointee This person testified at a congressional hearing.
election_contest election A contest was added to this election.
election_update election Details of this election changed.

Notes