put menu items into links - because of the SEO

This commit is contained in:
Senad Uka
2016-01-26 05:43:05 +01:00
parent 0e2e5b8fb9
commit 30e48cd1b6

View File

@@ -20,6 +20,16 @@ var MenuItemListComponent = React.createClass({
} }
}, },
menuItemUrl: function(menuItem) {
var url = "#"
if (menuItem.get) {
url = menuItem.get('url');
} else {
url = menuItem.url;
}
return url;
},
getInitialState: function() { getInitialState: function() {
var state = MenuItemStore.getState(); var state = MenuItemStore.getState();
var cartState = CartStore.getWholeCartState(); var cartState = CartStore.getWholeCartState();
@@ -44,6 +54,7 @@ var MenuItemListComponent = React.createClass({
MenuItemActions.unsetMenuItemHover(); MenuItemActions.unsetMenuItemHover();
NavigationActions.goToMenuItem(menuItem); NavigationActions.goToMenuItem(menuItem);
e.preventDefault(); e.preventDefault();
return false;
}, },
_onCartClick: function(e) { _onCartClick: function(e) {
NavigationActions.goToCart(); NavigationActions.goToCart();
@@ -121,16 +132,16 @@ var MenuItemListComponent = React.createClass({
{this.state.menuItems.map(function(menuItem) { {this.state.menuItems.map(function(menuItem) {
return <li className="mydropdown menu-large" onMouseLeave={self.onMouseOut} onMouseOver={self.onMouseOver.bind(self, menuItem)}> return <li className="mydropdown menu-large" onMouseLeave={self.onMouseOut} onMouseOver={self.onMouseOver.bind(self, menuItem)}>
<a href="#" className="dropdown-toggle " id={menuItem.get('title').toLowerCase().replace(/\s+/g, '')} onClick={self.onMenuItemClick.bind(self, menuItem)} >{menuItem.get('title')}</a> <a href={self.menuItemUrl(menuItem)} className="dropdown-toggle " id={menuItem.get('title').toLowerCase().replace(/\s+/g, '')} onClick={self.onMenuItemClick.bind(self, menuItem)} >{menuItem.get('title')}</a>
<ul className={menuItem.get('id') !== self.state.hoveredMenuItem ? "dropdown-menu megamenu row hide": "dropdown-menu megamenu row"}> <ul className={menuItem.get('id') !== self.state.hoveredMenuItem ? "dropdown-menu megamenu row hide": "dropdown-menu megamenu row"}>
{menuItem.get('menu_sub_items').map(function(menuSubItem) { {menuItem.get('menu_sub_items').map(function(menuSubItem) {
return ( return (
<li className="col-sm-3" key={menuSubItem.id}> <li className="col-sm-3" key={menuSubItem.id}>
<ul> <ul>
<li className="dropdown-header"><a href="#" onClick={self.onMenuItemClick.bind(self, menuSubItem)}><p>{menuSubItem.title}</p></a></li> <li className="dropdown-header"><a href={self.menuItemUrl(menuSubItem)} onClick={self.onMenuItemClick.bind(self, menuSubItem)}><p>{menuSubItem.title}</p></a></li>
{menuSubItem.menu_sub_sub_items.map(function(menuSubSubItem) { {menuSubItem.menu_sub_sub_items.map(function(menuSubSubItem) {
return (<li><a href="#" onClick={self.onMenuItemClick.bind(self, menuSubSubItem)}>{menuSubSubItem.title}</a></li>) return (<li><a href={self.menuItemUrl(menuSubSubItem)} onClick={self.onMenuItemClick.bind(self, menuSubSubItem)}>{menuSubSubItem.title}</a></li>)
})} })}
</ul> </ul>
</li> </li>
@@ -189,7 +200,7 @@ var MenuItemListComponent = React.createClass({
*/} */}
{this.state.menuItems.map(function(menuItem) { {this.state.menuItems.map(function(menuItem) {
return <li className="dropdown menu-large"> return <li className="dropdown menu-large">
<a href="#" className="dropdown-toggle " data-toggle="dropdown" role="button" aria-expanded="false"> <a href={self.menuItemUrl(menuItem)} className="dropdown-toggle " data-toggle="dropdown" role="button" aria-expanded="false">
{menuItem.get('title')} <b className="caret" /> </a> {menuItem.get('title')} <b className="caret" /> </a>
<ul className="dropdown-menu megamenu row"> <ul className="dropdown-menu megamenu row">
@@ -198,9 +209,9 @@ var MenuItemListComponent = React.createClass({
<li className="col-sm-3" key={menuSubItem.id}> <li className="col-sm-3" key={menuSubItem.id}>
<ul> <ul>
<li className="dropdown-header"><a href="#" onClick={self.onMenuItemClick.bind(self, menuSubItem)}><p>{menuSubItem.title}</p></a></li> <li className="dropdown-header"><a href={self.menuItemUrl(menuSubItem)} onClick={self.onMenuItemClick.bind(self, menuSubItem)}><p>{menuSubItem.title}</p></a></li>
{menuSubItem.menu_sub_sub_items.map(function(menuSubSubItem) { {menuSubItem.menu_sub_sub_items.map(function(menuSubSubItem) {
return (<li><a href="#" onClick={self.onMenuItemClick.bind(self, menuSubSubItem)}>{menuSubSubItem.title}</a></li>) return (<li><a href={self.menuItemUrl(menuSubSubItem)} onClick={self.onMenuItemClick.bind(self, menuSubSubItem)}>{menuSubSubItem.title}</a></li>)
})} })}
</ul> </ul>
</li> </li>