Location of HTML file in wordpress for editing purposes - javascript

I just finished learning CSS and I trying to edit the format of the footer of the wordpress based website.
I can spot its code from firebug extension but dont know whether the HTML file is located in the wordpress directory so that I can edit it. Can anyone help. I am new to web development.

Go to wp-content/themes/your-theme/footer.php
There should be the PHP/HTML for the footer.
It is not always that easy to find where the html comes from.
e.g. : You can have a widget area in your footer.php and then your html comes from the widget you added to this area.
It also depends on the theme you use.
But mostly you'll see a header.php/footer.php/index.php file.

the most easy way to find HTML code or text is here: String Locator. just download this plugin and type the html code or text you need to find out and you can easily know the exact location of the particular code or text and after that you can easily change it.
Cheers!

Related

How do i enable javascript in a .html document?

I wanted to learn a lil bit of website coding so I decided I want to see how a website is written. I used HTTrack Website Copier to copy a website and then i opend the index.html document. Now I saw a row where it says "-- Please enable Javascript --</p". How do I enable javascript to see what normaly would stand in that row? Also i dont have any html oder css file in the folder where HTTrack put the index.html into. Is that normal?
I dont know what to do about this cause i started 2days ago^^
Chances are, that page you copied is referencing a JavaScript file that you didn't download with the HTML file. Look through your HTML for a <script src="...">...</script> tag or something similar; that's the missing file. Same goes for the CSS, except that will be near the top with <link rel="stylesheet" href="styles.css">.
HTML is how the page is laid out. CSS is how the page looks (font sizes, colors, etc). JavaScript is how the page works (interactive features). I'd start with just basic HTML, you're kind of jumping in on the deep end. Codecademy has great (and free) introductory courses that should help you understand what you're looking at better.

How to get source code of this website?

I want to get source code (html, css and script) of a specific section on this website:
http://damnripped.com/tdee-calculator/
this is for my project. It's easy to get the html, even css however im unable to pick the scripts using chrome's "inspect element" or "view source code feature".
could somebody please help? I want to get the code for "TDEE calculator" form on the above said page.
Thanks!
It is a Wordpress plugin anyway: https://en-gb.wordpress.org/plugins/calculated-fields-form/
So it is all open source and free to look at.
You can use HTTrack to grab all website content including image, css, html, javascript.
You can download HTTrack here

How to embed HTML5/CSS + js music player on single wordpress page?

I have an html 5, css, and javascript audio player that I'm trying to add to one page on my wordpress site.
I tried to paste the html into my page's text editor, while installing the JS and CSS folders for the player in my child theme's folder, which didn't work.
I tried placing the CSS for the player styling in my child themes CSS file, and that didn't work. I also tried linking to the style sheets and js scripts from the header.php file, which wasn't working for me.
My first thoughts are that because the html is showing up as it should, the css and JS files aren't being called. So I just need to figure out the path structure of how wordpress creates pages? Yet I know wordpress does something with a database to display the pages?
I saw some documentation about using I think it was either php or JS functions to call scripts or something and I don't understand enough of those languages to be able to make sense of it yet.
I'm still working with my developer, but he's 7 hours ahead of me and asleep. I just want to put the hardcoded version of the player and a few songs on my site for now so I can do some testing/see how it looks.
I hope that this question meets the SO req's. I tried to search on my own and I know the answer is out there, I just don't know enough to understand it yet. Trying to get a head start
The path to your Child theme's folder should be '/wp-content/themes/name-of-theme/'. You can use that in your header to call the files from wherever you might have placed them in your Child theme's folder.
To hard code the HTML, pasting it in the WordPress page editor should work fine unless there is another JS call or some weird iFraming going on.. if that's the case, you can simply create a Page Template (https://developer.wordpress.org/themes/template-files-section/page-template-files/page-templates/#creating-custom-page-templates-for-global-use) and paste the code there. You'll likely want to just copy an existing page template from your Theme, take out the inner loop, and replace it with your video code.
Adding the links to your 'header.php' file would be considered bad practice. You would want to create a 'functions.php' file inside your Child theme and call the JS/CSS from there. You can also find this within the WordPress codex (they literally give examples you can copy/paste and change your file names).

Jquery script like google image preview

I am looking a script (example in web) like google images preview. I have attached an image what I am looking for
I have spend a time of looking such script / example but nothing. If someone know a name or a link please give it to me.
I have found a script but it's not exactly like Google Image's but has the same functionality. The script is free and is coded in HTML with CSS and JavaScript.
Click here to view the script

Drupal display 3rd party content with script

I am trying to add this script tag, which will display some 3rd party content, to my drupal page within admin -> content -< edit (using Drupal 7.36):
<script src="http://www.applitrack.com/dex/onlineapp/defaultlinks.asp?vacancyURL=http://www.applitrack.com/dex/onlineapp/jobpostings/view.asp"></script>
However, when I save and reload, the page completely ignores the script I added and shows a blank content area. I have the text format set to 'PHP Code', and there appear to be no restrictions on the html tags allowed. I have tried each of the different text formats, but to no avail. Any suggestions as to what else I may need to do would be greatly appreciate. Thanks in advance.
The best way to add js to drupal is with the drupal core funciton drupal_add_js.
drupal_add_js('http://example.com/example.js', 'external');
Create a very basic module and include something similar to that line in the hook_init function (if it's included on every page). If it is specific to a form include it in a form alter instead. Lot of other options to make it specific to the page its needed on but the general rule is include it only where it is needed.
You would have to change the ckeditor settings to make sure script tags are allowed
admin/config/content/ckeditor
This way however is not best practice and I suggest against it.
Edit your html.tpl.php template and add that js call near the bottom of your code.

Categories

Resources