Wordpress Breadcrumb Code - javascript

I'm trying to insert "Blog" into the breadcrumb where blog posts are being viewed.
I tried this with Javascript/Jquery by trying to see if "blog" is in the url, if so, then find & replace. Example that I used:
JS
if(window.location.href.indexOf("blog") > -1) {
$('#crumbs > a:first-of-type').replaceWith('<i class="fa fa-map-marker"></i>Blog')
}
HTML
<div id="crumbs">
<i class="fa fa-map-marker"></i>
Uncategorized <span class="current">Hello world!</span>
</div>
URL(domain replaced with #):
https://#/blog/uncategorized/hello-world
Although this doesn't seem to work without error. Rather, nothing has changed and there is no error in the Google Chrome console.
UPDATE:
I took the code out of the script.js file and placed it at the bottom of the footer like so:
<script>
$(document).ready(function() {
if(window.location.href.indexOf("blog") > -1) {
$('#crumbs').replaceWith('<i class="fa fa-map-marker"></i>Blog')
}
});
</script>
Now I get the error in chrome console: $ is not a function.

Related

How to remove this about:blank#blocked and make my function work?

I use this code below: (Django python)
<i class="fa fa-sign-out"></i> Logout
and when I click on it, nothing happens. But if i open it in a ne tab, google chrome says about:blank#blocked. How do I fix this
As far as I understand your problem is caused by usage error.
<script>
function myFunction() {
document.getElementById('logout').submit();
}
</script>
<i class="fa fa-sign-out"></i>Logout
It should work that way.

Polymer broken href for internal pages

So, I'm using polymer starter kit, but something doesn't feels right.
I created a new 'page', but the url doesn't change when i access through the menu. Then, inside this page, there is a <paper-button> with a link <a> to another html file on the same folder, but it doesn't work, when you click it says "Cant find: https:www.mywholelink.com/. Redirecting to your home page"
On the index.html, i've added the item in the menu
<a data-route="mobile" href="{{baseUrl}}mobile">
<iron-icon icon="settings-cell"></iron-icon>
<span>Register your smartphone</span>
</a>
Then, on the same file, i have the 'page'
<section data-route="mobile" tabindex="-1">
<paper-material elevation="1">
<a href="{{baseUrl}}device.html" tabindex="-1">
<paper-button raised><iron-icon icon="favorite"></iron-icon>Add your phone</paper-button>
</a>
<p>Wanna contribute?</p>
<p>By adding your phone you are becoming a sensor to this experiment</p>
<p>Also, you can see the phone sensor data in real time through your browser</p>
<p><b>All data is collected anonymously</b></p>
</paper-material>
</section>
I made sure to add code to the elements/routing.html
page('/mobile', function() {
app.route = 'mobile';
setFocus(app.route);
});
I'm hours on this and I don't know what i'm missing, please help

file_get_contents not working in a dynamic js call

So, I have been given an admin built in php and I was asked to implement an already done admin built in aspx into the new one(changing the css and so), the thing is that i want to dynamically "insert" into the main admin structure which is made in php only the part that's gonna be run in aspx, I made a reserach and found out that the way to do it was using file_get_contents and yeah it works, the thing is that i want that to show after I click on a link so I put the f_g_c into a js function to do so, the thing is that it doesnt work, it doesnt insert anything, it does it outside a function, but inside it just won't
<li class="active">
<a id="solicitud" href="" >
<i class="fa fa-file-text-o"></i>
<span>Solicitudes</span>
<span class="label label-primary label-circle pull-right">2</span>
</a>
var li = document.getElementById('solicitud');
li.onclick = aparecer();
function aparecer() {
<?php
$hola= "./solicitudAAA.aspx";
?>
var lo = document.getElementById('container');
lo.innerHTML ="<?php echo file_get_contents($hola); ?>";
return false;
}
above there are the section of code or well the link i want to click so it shows the aspx and the second section of code is the actual script, i don't know what I'm doing wrong and why inside the scriptit won't work, thanks for your answers!
The problem with your code has something to do with your link's href. A blank href in your anchor tag will refresh the page causing the onclick in your script to not work. How about adding the following:
<a href="javascript: void(0)" id="solicitud" onclick="aparecer();">
<i class="fa fa-file-text-o"></i>
<span>Solicitudes</span>
<span class="label label-primary label-circle pull-right">2</span>
</a>
To make things easier, add the function to the onclick attribute of the anchor tag to call the function rather than coding it inside the script.
Since onclick attribute(that contains the calling of function) is added to the anchor tag, you can remove this in the script:
var li = document.getElementById('solicitud');
li.onclick = aparecer();
I hope this helps!

.html() method of jQuery not working properly in IE 9

<h1>
<span id="T-1">
<div>1111</div>
<div><h1>2222</h1></div>
<div>33333</div>
</span>
</h1>
I have this html code for replicating the issue in IE 9. I am using the following js code:
console.log($("#T-1").html());
The above code is not fetching the full inner html data. It is fetching some portion of html data. Can anyone have a look at this issue.
Console output is:
<div>1111</div><div></div>
You are nesting h4 inside h1 and it causing the error which you are getting.
Write valid code like:
make all div to span
<h1 id="T-1">
<span >1111</span >
<span class="h4">2222</span >
<span >33333</span >
</h1>
checkout his pen

.append to "Add This Event" widget summary text using jQuery (Syntax Help)

I am unable to append values into the _summary class or any other. I believe its a really simple syntax error I am making. I have been trying different syntax's for the past day, with no luck.
I am using this widget.
Please help.
jQuery
$("._summary").append("hello world");
HTML
<a href="http://example.com/link-to-your-event" title="Add to Calendar" class="addthisevent" id="addthisevent">
Add to Calendar
<span class="_start">10-05-2014 11:38:46</span>
<span class="_end">11-05-2014 11:38:46</span>
<span class="_zonecode">1</span>
<span class="_summary">Summary of the event</span>
<span class="_description">Description of the event</span>
<span class="_location">Location of the event</span>
<span class="_organizer">Organizer</span>
<span class="_organizer_email">Organizer e-mail</span>
<span class="_all_day_event">false</span>
<span class="_date_format">DD/MM/YYYY</span>
</a>
After that calendar widget code does it's magic, all those internal <span> elements are set to display: none. The code is probably working, as you could verify with your browser developer tools (inspect the DOM).
After your code that modifies the text, add this:
addthisevent.refresh();
It's there in the FAQ. Here is a fork of VisioN's fiddle.
The text is being appended just fine. After you bind the AddThisEvent widget to the parent element, the child span elements are being hidden.
jsfiddle
<span class="_summary" style="display: none;">
Summary of the event
hello world
</span>
To make sure your updates to the <span> elements carry over to the calendar event, you can update your element with jQuery before calling the AddThisEvent Widget like this.
jsfiddle
<script>
$("._summary").append("hello world");
</script>
<!-- AddThisEvent -->
<script type="text/javascript" src="http://js.addthisevent.com/atemay.js"></script>
If that's not possible, it looks like you can also call the addthisevent.refresh(); method to refresh the data.
jsfiddle
<!-- AddThisEvent -->
<script type="text/javascript" src="http://js.addthisevent.com/atemay.js"></script>
<script>
$("._summary").append("hello world");
addthisevent.refresh();
</script>

Categories

Resources