How to add a button in Google Sites

[@FlippedClassroomTutorials]

Those that flagged the broken link. Thank you! Here's an updated link: sites.google.com/view/buttondemo/animated-button

[@virtualtravellingvideos]

Hello! Warmest greetings from Kazakhstan! I could make an animated button, however, I am trying to figure out why the button doesn't work. I mean How can I add the URL of the needed page so that the pushed button forwards me to the page I want? Could you please explain this moment?

[@kbrairconandelectrical5719]

Mate we are from mumbai India.. you had extremely solved our problem I pray for you good health and prosperity rewards. love you a lot mate. I am so happy.

[@FlippedClassroomTutorials]

This really made my day. Glad it was helpful

[@RepsUp100]

I wish Google added more features to Google Sites

[@FlippedClassroomTutorials]

More features are being rolled out soon but I agree that it could do with more. The next few coming are native slideshows so I'm excited about that!

[@onyxburstyt3995]

Thanks! This helped me a lot on my ICT project in school! It works perfectly

[@Ju-yj2se]

Really ThanKs , i followed your class and i made a lot of improvment One Question, might be basic... How can we link the custom buttons directly to a page within New google site? Thanks again

[@rajashreewagh5265]

Thank you so much sir,i am designing my library website by watching your videos,it's really very easy,as I am not an IT professional but you made it very easy, thank you

[@philiptownsend4026]

I'm doing the same for my CD and DVD collections, just my private jukebox.

[@omkarmamid]

What is it about? If you don't mind me asking! :)

[@mohammedyousuf4943]

Thank you sir. This video helped me a lot in making animated button for my google website.

[@professornez]

Extremely valuable! Love this Sethi! Thank you for sharing

[@FlippedClassroomTutorials]

Thank you! Really appreciate hearing that! Always great to see you in our comment section. Do let me know if you'd like to see more in depth content or different topics.

[@rayd2776]

Hello, Now after embded how to link it to a internal (previous page )?

[@teach_eve1264]

What if I want to use this button to navigate within the site, what do I put next to href?

[@camortegav]

Nice video, very useful! Is it possible when I click the button to open the link in the current window instead of in a new tab?

[@Igmlmushrooms9991]

This is very amazing button style. Thanks for the efforts

[@abdulmemon9967]

Simple, easy to the point! Great tutorial!

[@jaisonjoseph9292]

Great Channel, found it the most useful channel for Google site tutorial..

[@camman61]

your good and very fast !

[@FlippedClassroomTutorials]

Thank you. Hope it wasn't too fast.

[@sheetalhomedecors7846]

Hello Sethi, How to add call now button on website so that when user clicks on it, he directly calls the assigned number..? Thanks

[@estyonppluto]

Instead of a Url Can We Put An Embed Code and when clicking the button it redirects you to a new tab

[@Structural-tu9rz]

Same problem here

[@abinslaeh]

Thank you

[@stephanegregoire4386]

Heelo, how to link a customized button link to another page of the google site? What is the link? href? The element : target="_self" doesn't work.

[@angelv1393]

thank you ❤❤

[@FlippedClassroomTutorials]

Glad you liked it

[@angelv1393]

@@FlippedClassroomTutorials i learned a lot, now i am watching how to add games to google sites, i can't believe this is possible, thank you so much. I'm looking forward to learning more from your tutorials.

[@ZERRKERRH]

Hi you can do a tutorial abaut E-commerce for google Sites with shoppingcart

[@uniquedevotion2872]

MICHAEL KERRIGAN please! :)

[@johnphilip7087]

Yes we need a ecommerce tutorial for google sites

[@littlescholarhighschoolneredme]

Thank you. Well explained

[@wolfgangk1]

Your channel is one of the best of the lot for teaching coding to students of all ages. I have a question. QUESTION: I copy the code to my Google Site page and nothing... what am I missing?

[@FlippedClassroomTutorials]

It could be that some lines of code are missing such as body tags or you've selected the link tab rather than the code tab.

[@soilammirza9198]

Thanks so much sir

[@FlippedClassroomTutorials]

You're welcome

[@nanditar.8982]

Hi! Do you have a way to create a button or a click to call function for a phone number on G Sites?

[@7heavencatholictalkseries]

Just what I was looking for today! Phew! Thanks for sharing. Good video.

[@jacob_t_h_omas]

The link isn't working, what would be the issue..??

[@DaveLovallo]

great site but all i get after copying code is errors. Any advise. N o matter what script I try to embed.

[@Promonkey01]

Dear sir i have some problems, My form HTML code runs with submit and reload page It works normally in the web browser but it does not work on the google site, any Idea to solve this problem?

[@gulamghouse2910]

Excellent. Thanks a lot for sharing.

[@FlippedClassroomTutorials]

Thank you. Glad you found it helpful. Do let me know what else you would like to see :-)

[@gulamghouse2910]

Hi, I would like to know how to create folders in Google Site and save hyperlink of the files (Google Forms, Google Docs, Google Spreadsheets etc) from my google drive.

[@FlippedClassroomTutorials]

@@gulamghouse2910 are you trying to have folders on the site or are you going to link out to a folder on Google Drive? In regards to the hyperlinks to files, you can do this the same way you would link to websites. Get the URL from the share menu in Drive and use that link.

[@gulamghouse2910]

Actually, I want to have multiple tabs on my site and when I click on any tab, I should see a list of folders and then inside folders, I would like to save the files or have a hyperlink to the files from my google drive.

[@FlippedClassroomTutorials]

Ok I see, a possible solution to do this would be by using the html code and embedding the public folder using the embedded folder view tags. Google Drive folders can be embedded and displayed in list and grid views. An example is: or is you are on enterprise or GSuite for education: Hope this helps. If I find time I'll do a quick video on this :-)

[@rolandvos]

Of course you can also make your own button (non animated) in paint, photoshop and so on. Save it as .png / .gif or even jpg. Although not animated it could give your page the character you are looking for. Make the button, save it and then insert it in your Google site. Give it a link and your ready to go. Thanks agian for the interesting upload, looking forward for the net one.

[@FlippedClassroomTutorials]

True, Gif images are also supported so there is that too. Do keep in mind when using the image workaround that loading speeds can be impacted because of the images having to load. But yes, doing it this way is how we used to do it looong ago in html :-) Oh how I remember the days of tables hahaha Thanks for sharing, appreciate it! That's what this community is all about!

[@xmasterblue]

The difference is that the built in button works best for the mobile-first websites.

[@FlippedClassroomTutorials]

Absolutely!

[@AndreLuizLeite]

Fantastic. Thanks for share.

[@FlippedClassroomTutorials]

Thank you! Hope you enjoy all the other videos as well. I'll be doing a few more on sites as I'm looking at different things available and possible.

[@ManuelMartinez-uv7ei]

Hi, I have tried to use the embed several times doesn't seem to work for me any advice

[@adarshshukla9098]

This might be due to the extensions you are using in your browser, try the same on incognito.

[@mukundhachar303]

Thank you Sethi.

[@simonleung]

The default Google Sites button is not the best. Agreed that we should design our own if priority is making it look good. Have you tested if animated buttons have higher conversions?

[@Manchitre-Vromon]

Thanks

[@FlippedClassroomTutorials]

You're welcome

[@kieran8159]

Great video, it helped a lot. The only problem I'm having is that once I've designed my embedded button, I'm not sure how to link it to another page on my Google site. Is there a way I can find the page's URL or something else I can do? Thanks.

[@rcohendani]

me to

[@Hostqxa]

Love you from India l don't lesson your language l can talk poor English your very smart speak English ❤❤

[@jackhernandez6243]

Can this button be used to link a page inside the same google site? I tried to target="_top" but it didn't work. Hope you can help. Great tutorial!

[@ashwinachu8037]

Hi! Thank you for your precious content. Would u help out how to add Search button to website.....

[@turkesneck]

It'd be really great if you'd do a tutorial video on how to create a 'back to top' button. I am using Google Sites, but no matter what I do, it doesn't seem to work 😫

[@shirleyignacio4983]

Hi. Do you think it is possible to create a Floating Button in Google Sites? And if it's possible please make a tutorial. Thank you. 😊

[@kelztan]

Hi, can you make a tutorial to teaching about how to make a "Add to cart" function in google sites?? please

[@cabinetix]

embed ecwid / shopify

[@blco7100]

i ve puted a download link from google drive in the HTML code but it's not working , instead is working with the google sites button ,

[@FlippedClassroomTutorials]

Whenever you work with files on Drive the built-in functionality s incredible. The way Sites allows you to add and insert Drive content is fast and easy. Try using those rather than linking out to files. If you do link out to a drive file, make sure you check the sharing setting of that file. Hope this helps.

[@swethakaushal]

Can u explain, How to create button when clicked makes a sound...

[@rajashreewagh5265]

Sir I am unable to give a link to a pdf document on the Google site , please help me.. trying for two days but not happening.please

[@teddyw.charawa8989]

You are amazing!!

[@JobTak1]

Dear sir how to set payment gateway on Google site

[@S.T.A.R.Tutoring]

What do i do if the link in the button is a page on my google site, I cant figure out how to set the button .??

[@NGh_teh]

Tnx for sharing. I got 3 questions. 1st: how can I make this button sliding on my slide when I am scrolling down or up? 2nd: How can I reduce the perimeter of this button because it is occupying so much space right now. 3rd: How can I link sth to this button?

[@adminpma2890]

can we add gradient hover button in google site ?

[@romangabrielhermidatabora7598]

Hi i cant seem to create a link for the button con you help me

[@hassendrhammadi6470]

nice video ,thanks for sharing is there a way to add a call phone button thanks

[@FlippedClassroomTutorials]

Sadly, this is currently unavailable within Google Sites. I would suggest using the feedback button to let Google Sites team know you'd like this feature. I know many have already and top requested features are actioned.

[@dominicpacifico3252]

Seth, Great Video! Is there any code for google sites to hover over an image and have it change to another image? Would love that tutorial.

[@FlippedClassroomTutorials]

Hi, it's possible to do that with some basic Css and the embed code function. Not ideal but is does the trick. I will try and get a video on this up sometime this or next week. In the meantime: here's the code you could use: Change Image on Hover in CSS .card { width: 160px; height: 160px; background: url("drive.google.com/uc?export=view&id=1aBWAXQBP_-4jCaF49sopCP9eY7iB1NxK") no-repeat; } .card:hover { width: 160px; height: 160px; background: url("drive.google.com/uc?export=view&id=1Bqk4pgrX03X3Qib-qKJXG24-vV7w4tEx") no-repeat; }

[@dominicpacifico3252]

​@@FlippedClassroomTutorials Thank you so much! is it possible to add hyperlinks to these images when clicked. Ive seen this on many sites but cant find anything on the web site W3schools.

[@gem2186]

Hello, do you know if there is any way to make a button or icon that has one image to begin with and then another once you click it? Or a chart that auto fills with an image upon clicking the cell?

[@natalie5865]

How do I add a link to the button?

[@piratamorgan2998]

Thanks for your tips. Your videos are awesome and I like so very much. How can make a button for 'GO TOP PAGE' on Google sites. THANKS 😎

[@arch_n3m3s1s]

how do i link the animated button to a webpage

[@marketingoneNZ]

Hey there, thanks very much for this tutorial, it has me thinking, is it possible to embed code to get the site meta description's etc?

[@mdesoukymansour1]

Please we need more ideas to add to the website using the same technique

[@jaceanselmo7013]

How about to choose your own desired font in the button sir?

[@FlippedClassroomTutorials]

Fonts.google.com is great resource for all available fonts in google (Google Drawings and when referencing them in html) However if you are trying to use the built in buttons then Google sites is still limited in features.

[@jaceanselmo7013]

Thankk you@@FlippedClassroomTutorials

[@antoanto9671]

Can you teach how to make scrool to top button ?

[@alizakhan6910]

This button will. Work on mobile ? plz reply me

[@mentoringpokeronline2514]

ty for ur videos sir, it´s a real nightmare to adjust the button to get decent view on android and tablets, does this have any solution?

[@FlippedClassroomTutorials]

Not without changing the code. The way we get this onto Google sites is with an . We now need to make the and image responsive: www.w3schools.com/howto/howto_css_responsive_s.asp Which is a bit more work.

[@mentoringpokeronline2514]

@@FlippedClassroomTutorials well seems u just need to add this few line at the end (after ) : parent.document.getElementsByTagName('')[0].scrolling="no"; and voila, u can make wide the image and adjust to android, tablet and pc without the scroll bar, btw ty a lot for ur videos.

[@mentoringpokeronline2514]

@@FlippedClassroomTutorials also if u can please help me with this (sorry for the abuse xD), i have this card with shake, but need to include the line to hyperlink URL when ppl click, i am new at programing and don´t haave a clue!: W3.CSS img:hover { animation: shake 0.5s; animation-iteration-count: infinite; } @keyframes shake { 0% { transform: translate(1px, 1px) rotate(0deg); } 10% { transform: translate(-1px, -2px) rotate(-1deg); } 20% { transform: translate(-3px, 0px) rotate(1deg); } 30% { transform: translate(3px, 2px) rotate(0deg); } 40% { transform: translate(1px, -1px) rotate(1deg); } 50% { transform: translate(-1px, 2px) rotate(-1deg); } 60% { transform: translate(-3px, 1px) rotate(0deg); } 70% { transform: translate(3px, 1px) rotate(-1deg); } 80% { transform: translate(-1px, -1px) rotate(1deg); } 90% { transform: translate(1px, 2px) rotate(0deg); } 100% { transform: translate(1px, -2px) rotate(-1deg); } } parent.document.getElementsByTagName('')[0].scrolling="no";

[@juliettekhalil490]

I need help- how to make passord for one of google sites pages (for teachers only)???

[@servishpsamarinda]

Any idea how to put google tag manager or facebook pixel on google site? Im struggle with that

[@the50pipsguy]

Is it possible to add push notifications (pushengage or other services) to Google Sites?

[@Structural-tu9rz]

I am struggling to make this button open an url in the same website tab. If anyone there could help I would appreciate.

[@shlomolazar2541]

Hello, Thank you for the nice and clear presentation. I am a teacher in a high school. One of my students created a Python project which I compiled into an exe file. I have a school Google site. I want to add a button to my Google site and link the button to the exe file. Clicking the button will (hopefully) run the exe file. Is it possible? If yes, where should I upload the exe file to? If yes, what should I write in the URL? can you give an example? Your answer will be greatly appreciated. S. Lazar

[@jenniferlewicki6544]

can you add link to a google doc that is not editable? I have used adding a link that is view only and it still allows the doc to be edited

[@johnphilip7087]

Is it possible to add google tag manager and facebook pixels in google sites?

[@philbrown1339]

Hello. I want to add social media icons eg. facebook, twitter etc (with their original icons) to the footer of my google website. I have managed to do this, but despite making them very small, in "preview" mode, they all appear much larger which I hate. Is there a way to fix this? Thanks.

[@seanrolan7870]

Great tutorial but when using hover button I have sliders on my tablet and cell phone view. How do I remove this?

[@mastermike8053]

thank you , sooo much

[@exempliconfintech8450]

The button always opens in new window. I tried putting target="_self". This too does not work as google sites opens the link in the small placeholder itself. Any solution for this??

[@moroccoholidayspirit7026]

excelent teacher

[@pamtellier1032]

I cannot resize the button. It is cut off with a border box. How do I delete the old button because now I have two?

[@pamtellier1032]

I solved the problem with the two buttons. However I cannot position the botton exactly where I want it on the home page

[@bhavikdutt7128]

Hey 1 question: how can I make social media icon small in Google Sites??

[@TDS_Sandy]

i tried to embed but it doesn't show it!

[@kingakocemba3447]

hey, I had same issue on the chrome, check on other browser, like explorer

[@oogwayyourgadgetguide1410]

Assalamoalikum 1 question Can I add clickable table of contents in google sites

[@hayleylazo2890]

I made the button but I can’t click it everyone I do it just takes me to the screen again where it says to update the name or link

[@Melzza23]

Hi, I've pasted the html code into Google sites, however my button is not animated. Could you please advise what I might be doing wrong. Many thanks!

[@وجه_الجلد]

i cant find add sites on my adsense

[@karthik.a1443]

Showing this error Sorry! Something went wrong while displaying your document. To continue, please reload your browser Code:23077f3 Error:Client error

[@acer950]

After creating my new google sites, i couldn't find the "edit button" usually located on bottom right corner of the screen. How do i edit my website again? Thanks for helping!

[@akhileshsingh9616]

simply login to your gmail account using sites.google.com and you will find out your all created sites in sites.google.com

[@acer950]

@@akhileshsingh9616 Got it !

[@curiousseeker3784]

hello , so i am using google sites for my website, there i wanted to insert a medical survey too, i did so using google forms..Now more than this medical survey, i want to show the users the results too instantly there (like do they have a certain disease or not)....i noticed we can't access backend of google sites (or can we?) , so is there a way i can show the results of the survey when the users fill the survey?....

[@CouletteCAndrews]

the link does not work as explained in your video. something is wrong there please UPDATE thanks

[@asbestos464]

HOW DO I GET A WEBSITE TUM NAIL LIKE YOUR BUTTON DEMO WEBSITE PLEASE

[@madalenacarolino1342]

Hi. Thank you, I enjoyed that. Please could you show me how to add a Facebook LIKE button to a Google Site. Thank you so much

[@minetee1125]

How I can link it to?

[@jimkhan3610]

Hi, nice video. I've made amazing buttons that works just fine on the preview for laptop, desktop and phone but on my motorola android phone the button wouldn't work, they wouldn't redirect to any new pages. I had to revert back to google site buttons

[@jadewalters9748]

Can someone please help me? I have the button that I want but I don't see anyway to add a link to it so when they click the button it redirects them to the webpage I want them to go to.

[@ribierahmadalkeni8453]

💯 Thanks for everything you’re the best one for teaching how to use Google tools I love everything what you’re doing man I really love it thank you again💯

[@jorgehoraciogonzalezrivas]

Hi!, How I can use OPEN GRAPH in Google Sites in order to get a preview and description of my webpage?

[@GD-gc7fp]

How can I left justify the text in a button?

[@giandigiandomenico5500]

Hello. How do I prevent a button or link from opening in a new window? I would like to create NEXT and PREVIOUS buttons on my site. However, when I click on them, my webpage link opens in a new window. I would like it to open in the same window. Thank you.

[@staywoke272]

Because of some extensions, it was causing error. comment section helped me.🤩🤩🤩🤩

[@FlippedClassroomTutorials]

Brilliant! Cheers for the comment section! So much value in here and many member of the community helping! Thank you!

[@staywoke272]

hey, how can i add a floating cookie consent. when i tried to add it stays only at one place. i want it to display wherever the user scrolls until they press "got it". please help me

[@heyus666]

How do I make a top level navigation item non-clickable?

[@exempliconfintech8450]

You can go ahead in the pages option in the right panel. Click on the three dots on the page you want to hide and click on hide from navigation. But if you want it visible in the top nav bar and still not clickable then I am afraid that is not possible. You can only hide the page from users.

[@gamer_tamer6912]

Hi Sethi, I appreciate the clear steps but whenever I try to imbed a code such as the card or button I get an error and it doesn't load. Could you please tell me if you know to do?

[@FlippedClassroomTutorials]

Are you making sure that when inserting the code, you paste it into the insert code section of Google Sites? If so double check the portion copied and make sure you have you html head and body tags as well. Hope this helps.

[@gamer_tamer6912]

Flipped Classroom Tutorials thanks for the reply. Yes I am doing embed code I used the code which worked on CSS but when I embed it I get an error imediately after saying to refresh the page.

[@FlippedClassroomTutorials]

Did you try the code I've put on the website linked in the description? Is that giving an error as well?

[@gamer_tamer6912]

Flipped Classroom Tutorials yes copied from the doctype line to html and it still gives the error

[@FlippedClassroomTutorials]

Strange, just checked again and seems to be working fine on my end. Not sure what could be the issue. Maybe you can try creating a new sites file and embedding it into that one.

[@IM-LAND-SHARK]

how to add CALL button link on y google site?