Is there a way to edit css of new google forms? - css

Before I used to be able to just copy the source code of the form and paste the part between <form></form> into the page and add my own styling. But this doesn't seem to work anymore.
Has anyone found a way to still be able to customize google forms?

Yes, you can easily make the <form> work by following these steps.
Create a Google Form.
Get the link and open the form in a new tab.
Create a barebone form having same items as the Google form.
Inspect Google form for action attribute.
a. Copy the same action to your form.
Inspect and find values for attributes name in the Google form.
a. Give the same name values for your form items as well. The values look like entry.742532386.
Check if your form gets the responses.
Since it is a native <form> element, apply CSS however you want to.
Read more here

Google forms does not currently (mar-2021) have a built in feature to add css or javascript to their forms.
I created this GitHub project to work around the problem: https://github.com/calledit/google_form_javascript_css

Related

retrieve form element to generate next element (google-script)

A bit of a noob so please forgive me.
I am working on a project using Google Sheets and Google Forms. I would love to use javascript and html but I am required to use google.
I have a google form with a drop down. I need to read the value of the drop down and pass it to a google script I have written. The script will populate the values for another question in the same form based on the dropdown value. I need to retrieve the value before the form is submitted so I can create the second question.
Can this be done all on one page?
If not can I create a second page in the form and read the value when the next button is clicked?
I appreciate any info and feedback you can provide. I have tried looking around on the internet but haven really found solutions that helped me, at least not that i understood.
Thanks

Custom Google Form? Example of Google Form API?

I'm trying to make a google form look like my own site. I found examples of how to do this on How to style Google Forms and google-custom-form (GitHub project), but I tried both of the examples they give and they seem to fail now.
I had a look at Class Form - Google Apps Script which seems to be like an API, but I can't get my head around the documentation. Does anyone have an example of it working. Or has found another way of getting this to work? It would be really handy to do as embedded forms look really out of sync with the rest of the site.
The API you're linking to is an apps script API. This is needed if you want to create dynamic forms (dynamic amount of questions, dynamic answers,...) but not for custom styling. An intro to appscript can be found on this page: https://developers.google.com/apps-script/
You could just create a form manually on https://www.google.com/forms/about/
You can change the styling and colors in the top-right of the page. When you are ready to embed the form on your own page you have to press "SEND", an select the embed icon <> at the top.
I've worked with this a ton, and still have issues with it. Been learning the new api v4 for sheets but still having trouble, it is still in beta too. For now I can recommend this solution though by heaversm on github.
https://github.com/heaversm/google-custom-form
The example fully works as long as you find the entry.xxxxxxx for each field and replace in the appropriate js. To avoid the embed issues, give your form submit on a click function that has the event as the input and then preventDefault on the event like so:
$('#submit-button').on('click', function(event){
event.preventDefault();
// continue code from heaversm
});
Hope this works for you. Cheers

google analytics event tracking for PDF downloads, Generic approach

I need to implement the GA tracking event for PDF file downloads, For that had searched a lot and found out many code where i can add some code to links and track them from GA's content section, But the problem is I do have a lot of PDF link on the page and don't want to edit every link and I want the code to be generic for future uploaded links also.
So what would be the best approach for this task, Any referral links would do or any code would be highly appreciated .
Thanks in advance.
You can explore the use of Google Tag Manager, where you can create a generic tag that will return to you information for each individual link. GTM uses things called "macros" which is like a template that returns useful information including the clicked element's ID, or pathname (which in your case for the PDF files, would all be different). So in this way, you would only need to call this macro each time a PDF file is clicked. No coding is involved using this standard approach through GTM. Here's a link to a descriptive explanation: http://porcelainduck.com/2014/03/track-pdf-downloads-google-tag-manager/. You can see that it uses the {{element URL}} macro that returns the PDF's unique URL. GTM not only applies to current links, but also all future links.
Based on the tags which you've used to mark your question with you're using C#, ASP.NET
If that's the case, can't you create a base page that on rendering replaces all the
I would recommend adding a click event with JQuery to all links or all links inside the download widget class. Inside the click handler I would then grab the link text and use that as part of the Google analytics event you fire.

Django: Hiding necessary forms on template page

I have a Django application which takes the lat/lon from a user's coordinates via HTML5 geolocation and places these into form fields via jQuery. Markers are then placed on a map using these coordinates. This works very well.
The problem: I want to hide these forms so they're invisible to the user, but these still need to be "on the page" so they can receive the information. So excluding these via the Django forms file won't be acceptable.
I tried one method which hid the form field but left the form label. I'd like to hide the entire row from the user and remove the space where the form field exists while it still remains in the background to receive the info.
Is this possible? Not sure if it requires a CSS trick or a something built-in to Django.
Any help or insight appreciated.
Give your forms an ID and in CSS set display: none for these IDs. Alternatively, use a common class instead of separate IDs.

Is There a way to customize the IN/Company link for LinkedIn

I have inherited some code which uses uses the LinkedIn Company Profile API. At least that's what I think it is. Basically a script tag is rendered in the following format:
<script type="IN/CompanyProfile" data-id="9999" data-format="click"></script>
This together with .js file creates a link with the Linked-in logo which when clicked on reveals profile of company. Question is, can I customize the link. I want to add some text to the right of the linked in logo. I couldn't find any relevant documentation on it. I added a span tag with some text and attempted to wire up the click of the span, so that when clicked it clicks the linkedin icon. That doesn't seem to work-- which I found rather odd.
Any thoughts?
The Company Profile plugin builder is here:
https://developer.linkedin.com/plugins/company-profile-plugin
Customization of this plugin is limited to width (using data-width) at this time because of the complex layout. However, you could build something similar using the Javascript API if you need something more customized to your system.
This is another option that is more customizable, but has less interactivity:
https://www.linkedin.com/profile/profile-badges

Resources