Wordpress Filter by Tag with Ajax - ajax

I'm setting up a P2 themed (using Houston child theme) Wordpress. I want to accomplish the following but after hours and hours of searching I cannot figure out how to do this even though it seems like something that would be common.
Ideally, I would like a tag list in the sidebar with checkboxes for each tag. Only posts that match checked tags are displayed and it updates with Ajax rather than a page reload. It saves what you have checked to the user profile (page will require login).
I would settle for simply having a tag list/cloud that would update with Ajax if I could also have links that would display multiple tags. It's no problem if I have to hard code these tag-grouping links.
Basically I want users to control what posts they are interested in reading, the assumption is no one will be reading every post, just the tags that pertain to them.

The best I was able to find was this plugin:
Cat + Tag Filter
http://wordpress.org/extend/plugins/cat-tag-filter-widget/
And configuring it for checkboxes on tag. It doesn't reload with Ajax or remember what the user selected, but it does take you to a tag filtered page that you could bookmark.

Related

Retrieve the content of a section via MediaWiki API

I have a MediaWiki page set up in my company's intranet.
I would like to get the content of a section in a specific page using MediaWiki API (through AJAX).
I would like to refer to the section by its title like 'General' and refer to the page by its title as well, like 'Licenses'.
Is it possible somehow?
The only thing I could achieve is referring to the page by its title and refer to the section by a number like this:
http://mywiki.local/wiki/api.php?format=xml&action=parse&prop=text&page=Licenses&section=1
But let's say I create a new section before 'General' I would have to update all my AJAX URLs that queries this page. So this isn't good enough.
I couldn't find any working solution for this. Any ideas?
You can do this by first retrieving prop=sections to get the list of sections and their numbers:
http://en.wikipedia.org/w/api.php?format=xml&action=parse&prop=sections&page=License
Then make your original request, with the section number you figured out based on the previous request.
Keep in mind that two different sections can have the same name.

how to use the facebook like button with ajax driven content and load dynamic content

I have searched the net for a solution but can't seem to get anywhere.
My page (php) is loading with one url (let's say www.mysite.com)
in the page several search options on music (albums) can be done and the tracks are shown. (without refreshing the page). the info comes from a database.
So the url stays the same.
In this search process the facebook meta tags (description, url, title) stay the same also because I never reload the page, I only load content into div's.
I would like to be able to 'like' the album, and backlink to it. So I have created the function to load the album by using the url: www.mysite.com?album=12345
I can show a popup with this url to share this.
So, if you go to this url, the content is automatically loaded based on the url parameter.
And on this spot (where you can see the url with the parameter ?album=12345) I would like to show the 'like' button as well. (I generated the url, so I use this in the code:)
echo '<div style="overflow:visable" class="fb-like" data-href="http://mysite.com/?album='.$albumid.'" data-send="false" data-width="300" data-show-faces="false">?</div>';
it works so far... (after I added the parse code to enable the button)
However the like button takes the default meta tags description and title etc.
Not particular on this album or artist - so it's not unique.
Note: if I remove the meta[property=og:url] from the header I can make the button backlink to the right url with the ?album parameter. Otherwise it would go back to the default root of the site mysite.com (this does make the lint tool give an error on the missing meta)
I have tried to add into this same function something like:
$("meta[property=og\\:url]").attr("content", "http://mysite.com/?album=<?php echo $albumid; ?>");
$("meta[property=og\\:title]").attr("content", "<?php echo $artistname; ?>");
$("meta[property=og\\:description]").attr("content", "<?php echo $albumname; ?>");
I did this so the meta tags will be changed, just to let the like button show the right description etc. However this doesn't work.
I understand that facebook scrapes the page (I used the lint tool etc.) but I will never executes javascript, so the meta tags wil stay as default (when first loading the page)
What can I do to make a unique like button, with it's own description (albumname etc) without making a html page for each one of them (millions of albums in the database...)
I hope it makes sense.
I can't seem to figure this one out, help please :-)
Based on the comments below I used the following solution:
you should create the right fb meta tags when the url (with the params ?alb_id=12345) is opened.
That's enough for the like button to do its job.
Your logic is fine, up to the point where you're setting the meta tags using jquery.
They should be set using PHP. As you can imagine the scraper won't execute the jquery, but if it's fed the already PHP-customized meta tags it will use them (as provided).
Just have the og:tags prepared server-side, depending on the albumId requested, and it should work. It might not work right away, I remember there used to be occasional caching issues with the scraper before.
In short, index.php?album=123 will send a different set of og:tags to the scraper than say index.php?album=321. Just set them up server-side.
<meta property="og:title" content="<?php echo $artistTitle; ?>"/>
What can I do to make a unique like button, with it's own description (albumname etc) without making a html page for each one of them (millions of albums in the database...)
You can’t, because Open Graph objects are URLs (resp. are represented/identified by their URL).
One URL == one Open Graph object.
But where’s the problem in having one URL for each album? Since it all works using parameters, it’s not like you have to create a page for each album URL manually …

Ajax driven timeline-style blog (in Drupal)

I have created a blog in drupal using CCK and taxonomy.
I wish to display my posts in a timeline, according to the posted date (using views).
So far I have created a listing of the post titles on a timeline.
I now want to display the posts using ajax, wherein clicking on a post title will load the content of that node on the same page. Going ahead I'll add each fetched node into a ul tag and thus create a carousel kind of display of all fetched posts so far.
Whats the best way of achieving this, considering that I have enough knowledge to create a custom module.
Here's where I got my idea from.
http://www.jvm-neckar.de
Try the aptly named http://drupal.org/project/timeline project. I used it long time ago... its a nifty module and you can visualize your various posts on a scrollable timeline. Posts that are frequent will be together and posts that are apart (in time) will be apart -- its all scaled accurately. It has integration with views, of course.
I'm not sure about whether it will meet your exact requirements. Check out an example here:
http://simile.mit.edu/timeline/examples/jfk/jfk.html

Ajax - How to change URL by content

I'll explain:
I have a picture gallery, the first page is display.php.
Users can flip through pictures using arrows, when you click an arrow it sends an Ajax request to retrieve the next picture from the db. Now I want the URL to change according to the picture displayed.
So if the first picture is:
www.mydomain.com/display.php?picture=Paris at night
I'll flip to the next one and the URL would be
www.mydomain.com/display.php?picture=The Big Ben
How do I do this?
The trick here are uri's with an anchor fragment.
The part before '#' points to a resource on the internet, and after normally designates to a anchor on the page.
The browser does not refresh if the resource is the same but moves to the anchors position when present.
This way you can keep the convenience of browser history from a usability point of view while replacing certain parts on the page with ajax for a fast and responsive user interface.
Using a plugin like jQuery history (as suggested by others) is really easy: you decorate certain elements with a rel attribute by which the plugin takes care of the rest.
Also kinda related to this topic is something called 'hijax', and it's something I really like.
This means generating html just like you would in the old days before ajax. Then you hijack certain behavior like links and request the content with ajax, only replacing the necessary parts. This in combination with the above technique allows really SEO friendly and accessible webpages.
You can use the jQuery history plugin for example.
changing the search of the url will load the changed url.
See also: stackoverflow, javascript changing the get parameter without redirecting
Do you really want to use AJAX here?
A traditional web request would work like this...
User navigates to display.php
User clicks "next" and location is updated to "display.php?picture=Big-Ben"
Big Ben is shown to user, along with a link to "display.php?picture=Parliment"
User clicks "next" and location is updated to "display.php?picture=Parliment"
And so on.
With AJAX, you essentially replace the GET with a "behind the scenes" GET, that just replaces a portion of your page. You would do this to make things faster... for example...
User navigates to display.php
User clicks "next" and the next image location is obtained using an AJAX request
The image (and image description) is changed to the next image
What you are suggesting is that you retrieve the "next url" using AJAX and then also perform a GET on the whole page. You would be much better off sending the "next" image when you send each page and not using AJAX at all.
this best describes everything i think: http://ajaxpatterns.org/Unique_URLs

Is there a way to tell Google, certain elements are irrelavent to page?

I have a page that shows the main product for that page, next to it though are "related products" which when you click on them you go to their page, and they have their own related products as well. The problem is that the related products are getting indexed by Google so when you search for product-A you may get the product-B page where product-A is a related item, instead of just getting the product-A page. I am trying to prevent this. Any ideas?
Thanks!
You can add rel="nofollow" in any links you don't want a bot to crawl. In this case, you can apply that tag to all your links and google won't follow them off your main page.
http://en.wikipedia.org/wiki/Nofollow
EDIT for clarification:
Page "A" is for widgets. You want this page to be returned for searches regarding widgets; on this page is a "related searches" section which links to Other Widgets. On all the anchor tags on page "A" which link to pages "B" and "C" (the related searches for Other Widgets), you'll put a rel="nofollow" tag. This will prevent Google from hitting page A and then following your "related searches" links off to pages "B" and "C".
This will NOT prevent pages "B" and "C" from being indexed on their own, it just prevents them from getting pulled in from page "A".
EDIT#2:
rel="nofollow" tells bots you don't want them to follow the link to the second page. Regardless of the anchor text on a link from A->B, if you've nofollowed it the bot won't "flow" pagerank to the linked-to page and should not follow the link to page "B" to index it due to that tag on the anchor. Note that this is not foolproof: Yahoo and other SE's may not treat nofollow like Google....so your best bet is to make sure that each page is strongly on-page-SEO'd such that it gets included in the index for the term you want it to be included for. Hope this helps...but like much of the SEO world there are few hard-and-fast rules which apply universally.
yes... put them at the bottom of the page for content,
if you want that to appear visually at the top of the page, use a css layout to re-arrange the page elements
also, as darksquid already said, add rel="nofollow" to links you don't want considered
another tip (pertaining to your comment on darksquid's post):
You could load the content via ajax, which would keep most search engine spiders from seeing it at all (since they don't generally execute javascript)
Use Google Applicance - googleoff / googleon Tags:
http://www.geekzilla.co.uk/ViewC8614968-56ED-4729-9C12-F01677DAC412.htm

Resources