I have a search plugin that is more like a filter within a page (it's Swiftfilter and isotope filter). But I want the search to include all the pages on my website.
For example :
I am doing a travel website. When people search on index.html for "Italy". I want the search result directly link to italy.html page.
How can I do that?
What does this call?
Where can I learn/get this plugin?
Can swiftfilter or isotope filter enhance this?
Your problem can get a bit complicated. I'm afraid it's not a simple as finding a single plugin that can do this. It sounds to me like you have a static website, where content is stored across different, hard-coded pages. A static website can get complicated because number one, it would be slow/clunky to search hard-coded files on a website. Number two, you would have to deal with caching systems to speed it up.
If you want to implement a search feature, I suggest that you have a template-driven/database enabled website instead. Why don't you consider moving your site and all its pages over to something like Wordpress?
All your pages would get stored in a database and WP already has its own built-in search functionality. It works really well and I think you should consider it if you have a lot of pages on your website.
Related
We just updated portions of our website with AngularJS - particularly the login page. When I look at the search results in Google, the cached page and the small snippet it displays automatically is the raw Angular markup. So, lots of {{model.username}}, {{model.errorMessage}}, etc.
I won't link the results since it's too embarrassing.
Any idea of how do get Google to actually store the page as rendered vs. the raw HTML?
It would be wonderful if you would convert your embarrassment into a community service for all of us by testing something, since you are seeing a condition few people admit to or want to reproduce themselves. :)
Google is known to be relatively (or very, depending on who you ask) good at ignoring hidden content. They implemented this way back when people used to keyword-stuff content by using blocks that were either set to "display: none" or had a tiny/unreadable/white-on-white font.
What you're seeing is a problem for more than just SEO, so I'm suggesting this because things like prerender.io are great but they only solve that one piece. What about users who simply have slow browsers? Well, it turns out Angular has a great solution for this called ngCloak. It hides things like template content fields (ngModel mappings and bindings, expressions, etc) until Angular is ready to fill them in itself.
It's very easy to implement this; you just need a small block of CSS (in an early-loaded file, or embedded directly into your HTML page):
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
display: none !important;
}
and then you apply the ngCloak directive to items that are affected, or to a high-level parent (like your ng-view DIV):
<div id="wrapper" ng-cloak>
<!-- Page content here -->
</div>
This works kind of like a no-js target, but specifically for AngularJS.
You'll still want something specific to give Google that is actually good material, but at least with the above you can filter out everything else.
SEO for angular is a really big question/issue depending on your perspective. I would start by reading http://www.ng-newsletter.com/posts/serious-angular-seo.html and http://www.yearofmoo.com/2012/11/angularjs-and-seo.html to get you started.
To sum up your primary options:
change your routing system to use the hashbang (#!). Then sites like google and facebook will convert the hashbang to _escaped_fragment_ before querying your page. This gives your server an opportunity to return different html.
use a service like http://prerender.io which will pre render and cache rendered versions of your site for you, which will be provided to google in place of your site.
There are still issues with things like sharing to reddit and stumbleupon for example, as they are lazy and don't want to develop to cater to angular based sites. So for certain circumstances you will have to get creative.
Update: One thing we have done on a recent project is look at the various user agents to determine if crawling systems are asking for page information. This way we can serve what ever we like.
I know, I should have built this in a progressive enhancement way instead of trying to gracefully degrade. But I didn't. So now I need a way to make this work, preferably without altering the structure too much.
What I need is, if they don't have javascript enabled, then it will reload the page and add a hash tag. Based on that hash tag I wish to load different data into a spot.
I am using Drupal and this is dynamic content and there are hundreds of pages. I can change the markup easily across all of them from the template... it's just a very basic implementation of Organic tabs, but with variables in place of the tab titles and bodies.
Based on my research, I would think this has to be done manually (with separate pages that "look" like tabs), but I know that is not the case as I have seen this functionality here: http://observers.gohernandez.com/election/results/2005/kabul With the quicktabs module.
Thanks very much in advance.
I found, after sifting through literally hundreds of tabs plugins, this one that actually degrades gracefully: http://blog.ginader.de/archives/2009/02/07/jQuery-Accessible-Tabs-How-to-make-tabs-REALLY-accessible.php
how can I create the 4type or 3type tab list that are in this page - http://demos.brianmcculloh.com/swagger/ located in right side? I have seen that on many sites. Basically is there any free plugins, that would allow me to create something like this easily, or Will I need to make it by myself with show/hide functions, and how hard is it to make something like that? If there's already free plugin, then I need plugin, which is free for commercial use (allowed to be sold in marketplaces with ready blog/portfolio templates).
Not sure what is the 4type or 3type tab list,but for easy tabs,jquery-ui is fine
http://jqueryui.com/demos/tabs/
On my site, I collect information on items in a game I play. I would like to implement some sort of custom search for the items that is both easier to use, and displays the result in a more aesthetic manner.
Currently, I use a wikidot site which allows tags to be assigned to pages and they can be searched, but searching multiple tags doesn't work as I would like. It will start the list with pages with all the tags, then pages that have one of the tags, and finally pages that just happen to have the tags in the body. Also, the results are presented as the page title, the first few lines of text from each page (without any line breaks making it hard to read), and finish with a link to the page. [See example: http://imgur.com/a/gyTtD#0 ] What I would like for the results are something like the following: http://imgur.com/a/gyTtD#1, which is an actual page from my site, but it's not dynamic, I must edit that page if I want to keep it up to date; and for any permutations of tags I want to create a page like that for, I need to first find all of the relevant items, organize them how I want, then make the page containing the includes for each of their individual pages (each item has its own page, I just put an [[include item-name]] wherever I want that item to show up on other pages, which just puts the body of the page in.
What I'm looking for is the best plan of action to make this happen. I'm familiar with HTML/CSS/JS, but not much other webdev related stuff. Is there a way I could have a page with a comma separated list that I could parse with JavaScript to search pages? Or if should I look elsewhere, what are some good tutorials or quality sources to read up on how to do this?
Thank you in advanced for any answers you can provide.
If you still require help with this, I'd suggest asking on the Wikidot community wiki instead, as there are more people able to help you with your question there (as you have a Wikidot site).
URL: http://community.wikidot.com/forum
I built a javascript menu list from a xml file and has used it as the navigation menu in over 20 pages.I used jQuery's ajax functoinality to implement this,the reason I used this technique was because if there is an update in the menu list I only have to edit the xml file for the changes to reflect in the menu list. I only realized later the technique I have used is not SEO friendly,since SE doesnt index dynamic Javascript content.Saying that I have provided a fall back for users that have diabled their java script by linking the xml file to a object tag in a noscript tag
<noscript>
<div>
<object data="menu/Menu.xml" type="all"></object>
</div>
</noscript>
Im not too sure if this is SEO friendly.
So my question really is how do one go about creating a menu list that is user friendly and that can be updated easily? If questions similar to mine have been answered before please point me to the links.I have done some searching and was not happy with the results I found but Im still looking for answers.
JavaScript is not SEO friendly. Anyway, you should be using a server side programming language like PHP's includes or Server Side Includes to do this.