I am coding in HTML and i want to add the subscribe button into my code for a certain channel, how? i have tried multiple ways. PLease help if you need more information please just say so.
This should work just add your channel name in the div.
<script src="https://apis.google.com/js/platform.js"></script>
<div class="g-ytsubscribe" data-channel="UEDCaamflyer" data-layout="default" data-count="default"></div>
For example my channel
Read the documentation here
Make sure you have included this JS file:
<script src="https://apis.google.com/js/platform.js"></script>
Related
Im trying to install tinymce to use with my text editor to allow the user to have a text box just like the stack overflow one. I cant get it to display though
ive put this in the head of my index file
<script src='https://cloud.tinymce.com/stable/tinymce.min.js'></script>
<script src='https:https://cloud.tinymce.com/stable/tinymce.min.js'>
</script>
<script src="//tinymce.cachefly.net/4.1/tinymce.min.js"></script>
<script>
tinymce.init({selector:'infotextarea'});
</script>
then in my info page ive put
<textarea id="infotextarea">Your content here.
</textarea>
can anyone explain why its not displaying
It may be that at the time you run the tinymce.init function, it is not yet rendered and there is no textarea in the DOM.
Try debugging your code on the following line:
<script>
debugger;
tinymce.init({selector:'infotextarea'});
</script>
When the web's execution has stopped on that line, in the development console of your browser type the following:
$('#infotextarea').length
If the size is greater than 0, textarea exists at that moment and it is another problem, but if it shows 0 is that you have not yet created that view, this will help us get more information about your problem.
If you want to target a <textarea> by ID you need to use a valid CSS selector.
selector: "#infotextarea"
(note the # at the beginning of the string)
I would also note you appear to be loading TinyMCE 3 separate times - I have no idea why you would need to do that - loading it once should be sufficient
Its not a perfect answer to my question, but i used ckeditor and it worked perfectly.
I must have a mistake somewhere that i or my team could not find with tinymce
Good Day,
I am working through freecodecamp and am currently grappling with the quote generator problem. I have run into a bit of an issue with getting functionality for me scripting a change when clicking the button. Basically I have my own code which I'll post below, but also trying to simply copy and paste the code from them I am still unable to get functionality in my button.
I am sure it's an honest and easy mistake but hopefully that should make it all the easier to resolve :) Let me know if you have any questions and I genuinely appreciate it!
(please note I simply want to change the display message upon clicking the button)
<script>
$(document).ready(function(){
$("#getMessage").on("click", function(){
$(".message").html("New Message");
});
});
</script>
<div id="wrapper">
<button type="button" id = "getMessage" class = "btn btn- primary">Generate New Quote</button>
</div>
<div class= "text-center">
<div class = "message">
Sample
</div>
</div>
As the others have mentioned, you are most likely not adding jQuery, yet you are attempting to use it ($). To confirm this, check your console. It's probably filled with Uncaught ReferenceError: $ is not defined.
Assuming you're using CodePen as the challenege says in the objective, you can very quickly and easily include jQuery. To do so, just click the settings cog next to JS, use the Quick-add drop down, and select jQuery.
If you wish to include it manually (as you will most likely have to in future development) I recommend Drefetr's answer.
There do not appear to be any major issues with the code (with respect to the logic, the editor may have rendered your formatting a little nastily).
Can you confirm that you have included the jQuery libraries within the header of your HTML document? e.g.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
For more information: https://developers.google.com/speed/libraries/#jquery
I just wanted to know how I can create a button that can take a person to multiple websites in a random order when it is clicked each time. I plan on using this button for a toolbar that I'm planning to create, and the outline that is provided for the HTML component looks like this:
<html>
<head>
<!--
Uncomment out the below script reference as needed. For more information on using the API, please consult http://www.conduit.com/Developers/overview.aspx
<script language="JavaScript" src="http://api.conduit.com/BrowserCompApi.js"></script>
-->
<style type= "text/css">
<!--
BODY {margin-left:0; margin-right:0; margin-top:0; margin-bottom:0;
width:100%;height:100%;overflow:hidden;background-color:threedface;}
-->
</style>
</head>
<body>
<!-- ENTER YOUR HTML HERE -->
</body>
</html>
Is there any way that I can do this by using this outline? Thanks in advance.
As suggested by others, simply make a button click call a function that picks a random site from an array. Here is an explanation on how to pick a random element from a Javascript array.
Example implementation:
<script type="text/javascript">
var websites = ["http://google.com", "http://reddit.com", "http://stackoverflow.com"];
function randomWebsite() {
var website = websites[Math.floor(Math.random()*websites.length)];
window.location = website;
}
</script>
<button type="button" onclick="randomWebsite();">Random website</button>
I'm not going to write the script for you but you'd want to use javascript to do this. Use the random function and assign your website urls to an appropriate number.
Example:
if you had three total websites then you'd do the random function and assign 0-.33 website 1, .34 - .66 website2, and .67 - 1 website 3.
You need Javascript for that.
You can have a list of websites.
You can get the website you will go to, when the button is clicked, by using the random function in javascript.
Here is the example when using an array, Getting a random value from a JavaScript array
Hope it helps.
We shouldn't give you any code, as you didn't provide anything. But your algorithm should follow what I mentioned.
I think you need javascript to do this,
Take a look on this page maybe this can help you
http://ozirock.hubpages.com/hub/How-to-make-a-Random-Page-button-for-your-website
I have the following gist...
https://gist.github.com/4445255
I try adding it to my Blogger entry (per here) into my post by adding this to the very end...
<script src="https://raw.github.com/moski/gist-Blogger/master/public/gistLoader.js" type="text/javascript"></script>
finally in position I add
<div class="gistLoad" data-id="4445255" id="gist-GistID">Loading ....</div>
But it just shows loading...
The script you just referenced (gistLoader.js) contains a call to the function initGist(), which I do not see anywhere.
It is also looking for a DOM element by the id "gistPrinter", when the element you have created has an id of "gist-GistID".
I'm not familiar with gist, maybe someone else can correct me.
EDIT: I found initGist() here: https://raw.github.com/moski/gist-Blogger/master/public/gistBlogger.js
I hadn't yet converted my project over to a Dynamic View. So I went to Template>Dynamic View.
There is a little issue, saving formatting only seems to work in IE for dynamic views...
http://productforums.google.com/forum/#!topic/blogger/S_uVwRQQrOY%5B1-25-false%5D
You forgot to setup on of the attributes. It should look like this.
<div class="gistLoad" data-id="4445255" id="gist-4445255">Loading ....</div>
I had recently found this issue wherein the gist was not loading after putting the embed url eg
<script src="https://gist.github.com/dishabhatt123/43e98122304000687293b4c3ef3dc474.js"></script>
directly into the HTML view of my blog. Here is what has finally helped me after grilling down.
Basically browsers does not support random included scripts hence using rawgist. Place the below script on the top of bottom of the page.
<script src="https://rawgit.com/moski/gist-Blogger/master/public/gistLoader.js" type="text/javascript"></script>
Then, add the div as under:
<div class="gistLoad" data-id="43e98122304000687293b4c3ef3dc474" id="gist-43e98122304000687293b4c3ef3dc474">Loading or something, this is just text to display while the browser pulls the gist....</div>
Here, in the above div, data-id ="whereveryourgistidis" and id="gist - whereveryourgistidis"
In the above example of embed url, my gist Id is '43e98122304000687293b4c3ef3dc474'. You can replace it with your gist id from the embed url.
Please Note: you will not see the gist in 'Compose view'. But when you preview your blog, you can see it!!
Is there any way to write script in css and call or execute it whenever required ?
I need a <script> tag to be executed .
i need something like this..
css code
#execute{
<script> ..some script.. </script>
}
so whenever i use
<html>
.
.
.
.<div id="execute" />
.
.
.
.
</html>
so if i change the script changes will be reflected everywhere.
Is it possible?
EDIT:
Is it possible to keep my <script></script> tags inside some js file and i will host it. and then i will call some function() from my HTML so that the script will be executed everywhere i need it.
Can someone show me any example, tutorial how i can do it.
I don't have much information about the Js file and how the function should be called.
Thank you all
Does it have to be in CSS? jQuery is a great, simple way to do what you're asking. You put all your style information in the CSS (what it's intended for) and keep your javascript in the html or a .js file. Take a look at http://jquery.com. The code would look something like this
$(function() {
$('#execute')
.someCoolFunction()
.anotherCoolFunction();
});
You use $(function() { /* code */ }); to run the code when your document is ready, and you use $('#execute') to grab the element with the execute tag. You can then do a lot of cool javascript really easily with that jQuery element.
No, you cannot mix CSS and Javascript this way. Why would you want to?
If you simply want a common JavaScript include, do it like this:
<script type="text/javascript" src="yourscript.js"></script>
You can't do this in standard CSS.
There is a way in which you can run code from within the CSS context, using a technology called 'Behaviours', referencing an HTC file (which is basically Javascript) in the stylesheet.
However, this technology is non-standard, and only exists in IE. It is therefore only really used to write hacks to make IE support features that it doesn't have which are in other browsers. An example of this in use is CSS3Pie.
If you're working on a site which will never be used in any browser other than IE, and you're happy to use a non-standard technology, then you may consider this to be the exact answer to your question. However I would strongly recommend you don't do this.
More realistically, you should be using a Javascript library such as JQuery, as the functionality you describe is pretty much standard fare for JQuery.
With JQuery, you would write code like this (in a normal script block, not in the CSS!):
$('.execute').each(function() {
/* your code here; it would be run for each element on the page with the class of 'execute' */
}
As you can see, it uses a CSS-style selector syntax to select the elements to work with.
(also NB: I've used execute as a classname here, not as an ID, because you imply that you want more than one of them -- note that you should never use the same ID more than once in any HTML page; it is invalid. If you need the same thing several times, use a class.
JQuery has functionality to watch for changes to elements, respond to events such as clicks or mouse over, and much more. Other similar libraries such as Prototype, MooTools and Dojo would also be able to do a similar job.
Hope that helps.
[EDIT]
Given the edit to your question, can you not just place the advertisment <script> tag inside the <div> on the page where you want it?
So with JQuery, you could write something like this to run your ad in each place you want it:
HTML:
....
<div class='execute'></div>
....
<div class='execute'></div>
....
Javascript code (remember to also include the JQuery library, or this won't work):
$(document).ready(function () {
$('.execute').each(function() {
advertisement(this); //change to whatever the advertisement script function is called.
});
});
Hopefully that will get you started. I can't really help you much more without knowing more about the advertisement script, though.
Also, the people who supplied the advert script should be able to tell you how to use it.
I believe a Javascript library like JQuery or Dojo is what you are looking for. It will allow you to add event handlers on tags with certain CSS attributes, which will behave exactly like what you are trying to do right now.
EDIT
Here is an example with Dojo pulled from the Google CDN that will popup an alert window when you click on any <div class="execute"></div> block:
<html>
<head>
<style>
<!--
.execute { background-color: red; height: 25px; }
-->
</style>
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6.0/dojo/dojo.xd.js" ></script> <!-- load Dojo from Google CDN
<!-- Let's register a onClick handle for any .execute div. -->
<script>
dojo.ready(function() // Dojo will run this after being initialized
{
// Get A list of all tags with id execute and add a event onClick
dojo.query(".execute").connect("onclick", function(evt)
{
alert("Event triggered!");
// ...
});
});
</script>
</head>
<body>
<div class="execute">Click me 1</div>
<br /><br />
<div class="execute">Click me 2</div>
</body>
</html>
Edit 2
This example uses an onClick event but Dojo (JQuery) allows you to do much more things. For instance if you wanted to dynamically add an image or something onLoad inside .execute divs, you could do it with Dojo (JQuery) in a similar way to this.
Doing it with a library saves you a lot of effort, but if you still want to write and call your own functions from javascript files, this is a rough idea of how you would do it:
// myScript.js
function foo()
{
// ...
}
// page.htm
<html>
<head>
<script src="path/to/myScript.js"></script>
</head>
<!-- ... -->
<div class="execute">
<script>
<!--
// Call foo()
foo();
-->
</script>
</div>
<!-- ... -->
It doesn't really make sense to abstract a script into CSS like that, and even if it was a good idea, it can't be done.
Why do you need to run the same script over and over in different places? Consider whether or not there might be a better or simpler way to do whatever it is you're doing.
Plus, when you include a script with the src attribute in the script tag, if you modify the script's source file, the changes persist everywhere.
No, but you can use script to alter the CSS properties of any element in the DOM.