Did you enable Custom CSS on the plugin settings page? The custom CSS will be ignored if that checkbox isn’t set (Dashboard->Settings->Google Forms).
Did that, still it is not working.. could you tell me what code i need to write to reduce font size. I just wrote
body {font-size: 12px;
}
Try doing something like this:
div.ss-form-container {
font-family: Futura,sans-serif !important;
font-size: 0.75em;
margin: 0;
padding: 0;
}
When I did this in Firebug, the line graph on the page was visible. I don’t believe the margin or padding rules are necessary, they don’t appear to do anything.
Thanks for your help, its changing but its not coming in one page, like I want it in such a way that without any scroll from Q1 till submit button all should come without any scrolling. Currently the font is getting too much low and seems like invisible for the user if i want Q1 till submit button.
Also one more query, after submit button i wanted a functionality that the responses should be recorded, but it should go to other page, instead i wanted it to move down and see the graph (URL – http://www.getcsr.com). I used a redirect option as i had used anchor tags, but its not working properly (any help here would be great)
Thanks once again
Is it possible to view options to keep radio buttons horizontally like in my case the 3 options are one below other. is it possible to do it on one line?
In previous message instead of should, its shouldn’t
What size screen are you viewing your form on? Granted I have a big monitor here are work but I don’t have any problem viewing the entire form.
That all said, the Google Forms plugin can convert your form into columns. Your form would/should tighten up a bit if you make it two columns. You can also reduce the font size further. Play around with the numbers until you’re happy with.
Regarding the redirect, as long as you don’t have any Javascript errors on your page, redirect should work including the anchor tag. In your case, you probably want to try the AJAX redirect first.
You may need to use some CSS to hide the default Google form response content, it will likely be visible briefly during the redirect. My suggestion is to get the default text hidden with CSS before you implement the redirect.
As to showing the radio buttons inline – yes. Again, CSS is your friend and a tool like Firebug, which is what I use to figure these out, is invaluable for trying various CSS solutions. The following CSS will show your radio buttons in a row:
div.ss-form-container li {
display: inline;
list-style-type: none;
}
Thanks for the response
Well, that survey issue got resolved. Now everything comes without any scroll. Big Thanks for that.
Regarding inline, I am facing an issue while viewing it in mobile phone even though the theme is responsive. Les leave that for now. As without it my work is getting done in desktop view.
I searched in previous forums and got the code for removing those two things asked in separate Topic.
But one issue still left, I wanted to remove the header part, I typed the same code and replaced footer with header. Now the issue is, I am still getting one message
“Your response has been recorded”
I checked my Google Form, I have removed that default message, still its showing up. How to get rid of that?
Lastly, if you tell me the code so that, after user clicks submit, it shouldn’t go to another page rather it should slide down and view and graph.
Once again thanks a lot for your quick support.
The “Your response has been recorded.” message is part of the Google response. It isn’t in your original form which is why you can’t delete it from there. Have you tried looking at the HTML source? Right click on the wording and choose “Inspect Element” will show you that the “Your response has been recorded.” text is wrapped in a DIV with a class of “ss-custom-resp”.
div.ss-custom-resp {
display: none;
}
There is no way to avoid going to another page. That is part of the form submission process. The only way to do that would be to implement a true AJAX form submission and that isn’t something I plan to do.
Best you can do is create your own “Thank you for your submission page” which contains the graph you want to show and redirect to it upon form submission.
Okay. Thanks you for your response.
I added your last code.. still I am seeing that your response has been recorded coming up.. i checked the code.. the custom response code is present, but still the text is showing up.
Also, I have used required validation for each question while creating a Google Form. But I don’t want that word to be displayed in the form due to space issues.
I went to Settings, enabled “Override Google Default Text” Instead of Required I deleted it and kept it blank, but still that * is coming above all the questions. How to get rid of that?
I just looked at your form – it doesn’t appear that you are loading any custom CSS at all. There is none in the HTML source. Do you have the Custom CSS checkbox enabled on the plugin settings page?
Dashboard->Settings->Google Forms
If you defined validation when creating the Google Form then the text you see is part of that form. Whatever validation you set up I don’t think it is doing anything because I can submit your form without answering any of the questions.
The override text you’re messing with is for another purpose – if you want to change the text on the “Submit” button you would use the override text.
Thanks for your response
Well, Custom CSS is enables. I just checked it again.
This is what I have added in Custom wpGForm CSS
div.ss-form-container {
font-family: Futura,sans-serif !important;
font-size: 0.94em;
margin: 0;
padding: 0;
}
div.ss-response-footer {
display: none;
}
div.ss-custom-resp {
display: none;
}
I have temporarily removed validation because that required thing is coming up, i don’t want that. So what I did I removed the required word from your “Advanced Options”, but still ” * ” was coming above Q1 and at the end of each question.. I am okay if if comes at the end of each question, but I don’t want it above Q1 as it is creating problems for making the whole survey visible without any scroll.
Are you actually looking at the HTML your site is generating or simply expecting me to do it for you? Based on your questions it doesn’t appear that you’re really looking at the content of your page to see what class the message is wrapped in so you can hide it.
div.ss-resp-message {
display: none;
}
The div.ss-custom-resp class would be used IF you had set up a custom response page on the Google Forms side.
If you’re getting the required asterisk at an undesired location, it can usually be fixed with a “display: inline” applied to the correct element. This question comes up all the time and if you look through previous threads, you’ll see that the answer isn’t always the same but is typically similar.
Thank You. You really helped me a lot
