Announcement

Collapse

Information Needed

See more
See less

Is it possible to add CSS styling to Registration Block

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Is it possible to add CSS styling to Registration Block

    Is it currently, or are there future plans, to allow CSS styling to be added to the Registration Block itself to allow the changing of the color/size of "Continue" button, Header colors, font size, etc.?
    Last edited by [email protected]; 06-26-2019, 01:27 PM.

  • #2
    Good day @[email protected]

    We do have an option for custom CSS. You need to select the Custom CSS under DefaultSettings. Please follow the below image and make the changes then it shows you the option:

    Click image for larger version

Name:	Custom CSS.jpg
Views:	91
Size:	77.3 KB
ID:	47252
    Regards,
    Click & Pledge Support Department

    On Salesforce? Help us by rating our app: Click & Pledge Donor Management on AppExchange

    Join us @ the educational webinars: https://clickandpledge.com/webinars/
    Live Support available Join between 3:00 - 3:30 p.m. ET Monday - Thursday: https://clickandpledge.com/webinars/
    Are you on Salesforce? Join us at the Power of Us Hub: https://powerofus.force.com/0F980000000CjpC

    Comment


    • #3
      Thanks for this information. We were able to successfully edit the style of the registration block within an Event page through your instructions provided. Unfortunately, our use case is a bit different now and we are hitting a new roadblock. Our client is opting to use their own webpage as the event page and pull only the registration block onto the page via iframe. So they are coping the iframe code provided in the "Basic Information" tab under the event. Any custom CSS that we add within the Default Settings will not carry over when we are only referencing the default registration block via the iframe code. Do you know if there is a way/location to add CSS that will impact the registration block when we are referencing it this way?

      For more detailed notes, I am copying the information I received from one of our developers trying to help with this: "Adding css in the “custom css here” portion of the Default Site CSS text box under the CSS Styling options puts the CSS style tag within a DIV tag that is not displayed when the page has the WidgetType=RegistrationWidget url param" ..."Here are the elements that contain the css and are not shown in the widget: <div id=“Externalsite:externaleve” class=“bPageBlock brandSecondaryBrd apexDefaultPageBlock secondaryPalette”><div class=“pbBody”><span id=“Externalsite:externaleve:EventTemplatestyle” class=“CPEF”>".

      I noticed that we can design a custom widget. Would it be possible to replicate the default Registration widget with our CSS edits and reference that in the iframe instead? I don't think we have access to the default registration widget code anywhere.

      Comment


      • #4
        Good day @[email protected]

        As of now, the widgets don't have a custom CSS option nor we do have an option of custom CSS adding in the iFrame. However, you may try the below workaround which has been suggested by our developers:

        You will need to create one blank event site template and include the Registration Block merge field in the content area and here you can edit the template per your custom CSS. Once you save the template, click on View button which will open in a new tab. You will need to copy that URL and place under the iFrame as shown below:

        <iframe src="https://0******.secure.force.com/Events/cnp_paas_evt__ExternalRegistrationPage?event_id=** ****MGq1UEAT&tid=a1O3a000003OzBzEAK" align="top" height="900" width="960" frameborder="0"></iframe>

        Please see example screenshot:

        Click image for larger version

Name:	site template.jpg
Views:	93
Size:	123.6 KB
ID:	47333

        Hope that helps.
        Regards,
        Click & Pledge Support Department

        On Salesforce? Help us by rating our app: Click & Pledge Donor Management on AppExchange

        Join us @ the educational webinars: https://clickandpledge.com/webinars/
        Live Support available Join between 3:00 - 3:30 p.m. ET Monday - Thursday: https://clickandpledge.com/webinars/
        Are you on Salesforce? Join us at the Power of Us Hub: https://powerofus.force.com/0F980000000CjpC

        Comment


        • #5
          @[email protected] - I'm curious if this solution worked for you. Is this something that would need to be done for every event?

          Comment


          • #6
            Hi donhemrickjr sorry I didn't see your post in August. It did work for my client. And yes they have to clone the original example event we created and reuse this method since they have a highly customized webpage and only care to use the registration block, while having it match their website look.

            Comment


            • #7
              [email protected] Ha ha. I think we must have used this solution. Whatever our web developer did, it worked. Thanks!

              Comment

              Working...
              X