i have the text-align:center; applied to some other parts which is why it works for me and not for you. please try the code above.
If you add this code also the counter/headline/'9.070 images'-text would also be centered.
/* Make everything centered by default */
[COLOR="Red"].sm-search .sm-search-resultset {
text-align:center;
}[/COLOR]
Just for the record: here is my complete search page custom CSS:
[COLOR="DimGray"]/* set margins for the search results */[/COLOR]
.sm-search .sm-search-tile {
[COLOR="DimGray"]/* Small margins with no shadows */[/COLOR]
margin: 1px 1px 0px 0px;
[COLOR="DimGray"]/* Add some shadows...
margin: 20px 20px 0px 0px;
box-shadow: rgba(10,10,10,0.8) 8px 8px 5px 0px;
*/[/COLOR]
border: none;
}
[COLOR="DimGray"]/* Background color for album search result thumbnails */
/* Works also for albums that do not have a thumbnail */[/COLOR]
.sm-search .sm-search-tile.sm-search-tile-album {
background:rgba(10,10,10,0.2)!important;
}
[COLOR="DimGray"]/* Background color for photo search result thumbnails */
/* Works also for photos that do not have a thumbnail */[/COLOR]
.sm-search .sm-search-tile.sm-search-tile-image {
background:rgba(10,10,10,0.2)!important;
}
[COLOR="DimGray"]/* Background for the album info text */[/COLOR]
.sm-search .sm-search-tile-info {
background:rgba(20,20,20,0.8)!important;
}
[COLOR="DimGray"]/* Make everything centered by default */[/COLOR]
.sm-search .sm-search-resultset{
text-align:center;
}
[COLOR="DimGray"]/* I need black text for the "sort-by"-icon. */[/COLOR]
.sm-search .sm-form-field-select {
color:black!important;
}
[COLOR="DimGray"]/* Align info text for albums/photos */
/* User center or left... whatever you want */[/COLOR]
.sm-search .sm-search-tile-info-content {
text-align:center;
}
[COLOR="DimGray"]/* Add some beauty to the hover/mouse-over photo popup */[/COLOR]
.sm-search .yui3-overlay-content.yui3-widget-stdmod .yui3-widget-bd {
border: none;
box-shadow:rgba(10, 14, 18, 0.95) 10px 10px 24px 8px;
padding:10px 11px 11px 10px;
margin:-10px 0px 0px -10px;
background:rgba(80, 84, 88, 0.90);
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
[COLOR="DimGray"]/* to disable the search-sort box set display to none */[/COLOR]
.sm-search .sm-search-sort {
display:block;
}
[COLOR="DimGray"]/* This centers the search box on the results page */[/COLOR]
.sm-search .sm-search-input {
width:auto!important;
text-align:center;
}
.sm-search .sm-search-options {
width:auto;
text-align:center;
}
Yeah, I've been wrestling with that.
It's worth bearing in mind that the full selectors for the initial "empty" search page are different to those for a page with results.
Yeah, I've been wresting with that.
It's worth bearing in mind that the full selectors for the initial "empty" search page are different to those for a page with results.
Exactly...
the "empty" search page has a margin set. using this:
I do not use the default search page but have created a custom page with a search content block. That's why i'm not affected by that.
Yeah, I noticed that, I think I'll be moving to that method soon, looks like a lot less hassle. I'll sort it after I've dealt with the current infestation of buy cart icons.
This was all I needed to center the search results on my site:
Yes, you do not need the extra margin-left:0px; bits because you do not use the /search-page by default so no one would see your empty search filed. Except someone uses the direct URL:
Yes, you do not need the extra margin-left:0px; bits because you do not use the /search-page by default so no one would see your empty search filed. Except someone uses the direct URL:
See screenshot below. If you want to center this one also you need the extra margin-code.
Thanks for the screenshot. At first thought I could not imagine someone using the direct search URL, but well, you never know... I now also included the additional code and everything still works fine So, a BIG thank you for everything!
You folks are the best for tweaking this.
Is it possible to remove the Refine Results field altogether?
If I could replace the options in that dropdown with terms more relevant to me, that would be ideal. Assuming that's not possible, I'd just as soon remove it.
My question is: Why doesn't my search results render Galleries and Images? I just have Images come up. Also I'd like to change what they say if possible. Oh and how would I change the color of the categories under the search box? I tried adding color:black, but no joy. Thanks so much! :
You folks are the best for tweaking this.
Is it possible to remove the Refine Results field altogether?
If I could replace the options in that dropdown with terms more relevant to me, that would be ideal. Assuming that's not possible, I'd just as soon remove it.
Try this to remove the Refine-Button:
.sm-search-button-refine {
display:none;
}
I'm not sure but i don't think that it is possible to add more search options. I also would like to change some, at least the Apperture-Setting (Why only above f16?) but i'm not using these options much, so i don't really care.
My question is: Why doesn't my search results render Galleries and Images? I just have Images come up.
Interesting... i can see that on my site too. If i use the url/search-page only photos are shown. If i use a search-content-block and use the same search phrase i'll get photos and galleries. If some one want to test it:
My search site is here - Search for 2014 and all you get is photos.
My custom search page is here - Search for 2014 and you get a gallery and some photos.
No idea why this is different...
EDIT: If you want to give it a try: use a custom URL in the navigation menu bar instead of the Search page:
Phaserbeam, for some reason quote didn't want to work for me today. Anyway....
The remove "Refine Search" code worked like a charm! As did changing the category icon/words color. Thanks so much! Though upon further reflection, I opted to remove the categories/icons as the don't work as I like (see below about parameters)
When I'm on my search page it says in the browser tab | Smugmug Search. How do I get it to say Search | Imagery by Charly. Like yours says Search | phaserbeam.
To bring up the Galleries with the Images, I had to tweak it some by adding what's in red below.
myURL/search/?c=everything&n=smsitename&scope=node&scopeValue=0(Whereas smsitename for me would be imagerybycharly)
I'm wondering if there's any way to change the parameters when it searches for Galleries. Meaning if one puts in a keyword that is in a Gallery name, they will show. But if they put in a word that's not, then it will show 0 galleries. For example: Architecture renders 2 galleries and 91 photos for me, whereas Building renders 0 galleries and 31 images. (not finished with keywords as of yet). When one puts in Building I'd like it to show all galleries that Building is found in the keywords. Make sense?
My apologies for not being more clear. What I'd like to do is change what it says above galleries or images that render from a search. For Example: When I put in Animals is states 2 galleries and 28 photos and videos. I'll never have up videos and would like to remove that. Would prefer 2 Galleries and 28 Images.
When I'm on my search page it says in the browser tab | Smugmug Search. How do I get it to say Search | Imagery by Charly. Like yours says Search | phaserbeam.
This is because i have created a page with a search content block and a keyword content block. The name of that page is "Search" (with upper case S!) because the name "search" (with lower case S!) is used by smugmug for the default search page. The first word is always the gallery/folder/page name.
My name is shown in title because i have setup the Site Meta Title in Account settings/Discovery/Search.
Once you have entered a search term on my Search-page the browser title will change to what you see on your site:
Quote:
Originally Posted by ChancyRat View Post
You folks are the best for tweaking this.
Is it possible to remove the Refine Results field altogether?
If I could replace the options in that dropdown with terms more relevant to me, that would be ideal. Assuming that's not possible, I'd just as soon remove it.
Try this to remove the Refine-Button:
Code:
.sm-search-button-refine {
display:none;
}
Perfect! The odd thing is, I added all the code and now the main search field (before a search) is off-right.
I tried to reconstruct the code to use from everyone's posts and refinements. After a search, the search field is properly centered.
Thanks, I had missed that set. Looks very nice now.
One last question. I have tweaked every border combo I can, and cannot find the adjustment that will equalize the borders (blue in the image). I need to reduce the top and right. Which code does that? I have worked with W3S and multiple changes to the border settings and cannot for the life of me get it. Thanks.
Thanks, I had missed that set. Looks very nice now.
One last question. I have tweaked every border combo I can, and cannot find the adjustment that will equalize the borders (blue in the image). I need to reduce the top and right. Which code does that? I have worked with W3S and multiple changes to the border settings and cannot for the life of me get it. Thanks.
Looks like you have adjusted the space between the search result images using a margin. Instead of adjust top/left margins like:
Now the preview open nearly at the same position as the result-image. EDIT: The margins in this part will only move the preview on the page, they will not change the "border" around the preview image.
This is because i have created a page with a search content block and a keyword content block. The name of that page is "Search" (with upper case S!) because the name "search" (with lower case S!) is used by smugmug for the default search page. The first word is always the gallery/folder/page name.
My name is shown in title because i have setup the Site Meta Title in Account settings/Discovery/Search.
Once you have entered a search term on my Search-page the browser title will change to what you see on your site:
(search_term) | SmugMug Search - Mozilla Firefox
I don't think that you can change that.
Well I believe if I pay more for SM to have my own URL minus smugmug, then SM should be nowhere on my site. I mean, I not only pay for SM, but a web host that has no site on it just to be here with my URL. With all the wasted time I have put into my website both with Legacy and New, I could've paid some one to build a site the way I wanted it and not even be with SM at all. Just on my web host.
BTW, (search term) | SmugMug Search - Safari too. So on all browsers I'd say.
Now the preview open nearly at the same position as the result-image. EDIT: The margins in this part will only move the preview on the page, they will not change the "border" around the preview image.
Gasp and Thanks SO Much.
Who knew. lol on the borders which I had worked into a lather on W3S.
An interesting find: I have a search block on the 404 page (which has other customization as well). The CSS you provided, is showing up in the CSS block on that page. Yet I had added it only to the main Search page.
Isn't that interesting? I thought that content blocks could not be shared when one has "make this page separate" in place.
As far as I know the title bar will reference SmugMug unless you have a Portfolio or Business account.
I was curious enough to check and the browsers I use (IE11, Chrome, Firefox) no longer show a title in the window.
--- Denise
Denise, I do have a Business account, thus why I shouldn't see SM anywhere on my site, in my opinion. There should definitely be a way to stop that. Be it from a hack or on SM's end where I think it could be changed if they had a mind to. It shouldn't be that difficult as they turn it off everywhere else easily enough. I'm not happy that they don't have a mind to.... Even with phaserbeam's built search page it shows and I think it's because we have to use SM search parameters no matter what. Or maybe I'm wrong here?
No title in window? That's odd as it shows in both FF and Safari for me.
Comments
that is why we need more then three beta testers
Do you have a link to your search page?
Yeah, maybe I spoke too soon
http://www.laurencecounter.com/search
Gotcha!
.sm-search .sm-search-input { width:auto!important; [COLOR=Red]text-align:center;[/COLOR] } .sm-search .sm-search-options { width:auto; [COLOR=Red]text-align:center;[/COLOR] }i have the text-align:center; applied to some other parts which is why it works for me and not for you. please try the code above.If you add this code also the counter/headline/'9.070 images'-text would also be centered.
/* Make everything centered by default */ [COLOR="Red"].sm-search .sm-search-resultset { text-align:center; }[/COLOR]Just for the record: here is my complete search page custom CSS:
[COLOR="DimGray"]/* set margins for the search results */[/COLOR] .sm-search .sm-search-tile { [COLOR="DimGray"]/* Small margins with no shadows */[/COLOR] margin: 1px 1px 0px 0px; [COLOR="DimGray"]/* Add some shadows... margin: 20px 20px 0px 0px; box-shadow: rgba(10,10,10,0.8) 8px 8px 5px 0px; */[/COLOR] border: none; } [COLOR="DimGray"]/* Background color for album search result thumbnails */ /* Works also for albums that do not have a thumbnail */[/COLOR] .sm-search .sm-search-tile.sm-search-tile-album { background:rgba(10,10,10,0.2)!important; } [COLOR="DimGray"]/* Background color for photo search result thumbnails */ /* Works also for photos that do not have a thumbnail */[/COLOR] .sm-search .sm-search-tile.sm-search-tile-image { background:rgba(10,10,10,0.2)!important; } [COLOR="DimGray"]/* Background for the album info text */[/COLOR] .sm-search .sm-search-tile-info { background:rgba(20,20,20,0.8)!important; } [COLOR="DimGray"]/* Make everything centered by default */[/COLOR] .sm-search .sm-search-resultset{ text-align:center; } [COLOR="DimGray"]/* I need black text for the "sort-by"-icon. */[/COLOR] .sm-search .sm-form-field-select { color:black!important; } [COLOR="DimGray"]/* Align info text for albums/photos */ /* User center or left... whatever you want */[/COLOR] .sm-search .sm-search-tile-info-content { text-align:center; } [COLOR="DimGray"]/* Add some beauty to the hover/mouse-over photo popup */[/COLOR] .sm-search .yui3-overlay-content.yui3-widget-stdmod .yui3-widget-bd { border: none; box-shadow:rgba(10, 14, 18, 0.95) 10px 10px 24px 8px; padding:10px 11px 11px 10px; margin:-10px 0px 0px -10px; background:rgba(80, 84, 88, 0.90); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } [COLOR="DimGray"]/* to disable the search-sort box set display to none */[/COLOR] .sm-search .sm-search-sort { display:block; } [COLOR="DimGray"]/* This centers the search box on the results page */[/COLOR] .sm-search .sm-search-input { width:auto!important; text-align:center; } .sm-search .sm-search-options { width:auto; text-align:center; }.sm-search .sm-search-input {
width:auto!important;
text-align:center;
}
now throws it off to the right!
It's worth bearing in mind that the full selectors for the initial "empty" search page are different to those for a page with results.
Exactly...
the "empty" search page has a margin set. using this:
.sm-search .sm-search-input { width:auto!important; text-align:center; [COLOR=Red]margin-left:0px;[/COLOR] } .sm-search .sm-search-options { width:auto; text-align:center; [COLOR=Red]margin-left:0px;[/COLOR] }I do not use the default search page but have created a custom page with a search content block. That's why i'm not affected by that.Anyway... the code above must change something... not sure what...
.sm-search .sm-search-input { width:auto!important; text-align:center; [COLOR=Red]margin-left:0px;[/COLOR] } .sm-search .sm-search-options { width:auto!important; text-align:center!important; [COLOR=Red]margin-left:0px!important;[/COLOR] } .sm-search .sm-search-categories { width:auto!important; [COLOR=Red]margin-left:0px!important;[/COLOR] } [COLOR=Red].sm-search .sm-form-field { margin:0px!important; }[/COLOR]That did it! You are a star, thank you Sir
Happy X-Mas to everyone! :ivar
Oh yes, I forgot what day it was!
Happy Christmas
edit - One final thing I did was to make the text for the number of images slightly smaller -
.sm-search .sm-search-resultset h1 {
font-size:180%;
}
Cool... good idea. I also changed that ... but i'm using the current font-size/em instead of percentage, not sure what is better:
.sm-search h1 { font-size:1.5em; }P.S. If you have the sort-by-box enabled you should change the padding for the header or the sort-by-field would affect the layout...
.sm-search .sm-search-results h1 { font-size:1.5em; [COLOR="Red"] padding-bottom:20px;[/COLOR] }NOTE: I'm not a CSS-pro... i just try to make it look ok. I'm sure it can be done better... feel free to do so
.sm-search .sm-search-input {
width:auto!important;
text-align:center;
}
.sm-search .sm-search-options {
width:auto;
text-align:center;
}
.sm-search .sm-search-resultset{
text-align:center;
}
.sm-search .sm-search-tile {
margin: 3px 3px 3px 3px;
Thanks so much all for providing this information
Luc
Yes, you do not need the extra margin-left:0px; bits because you do not use the /search-page by default so no one would see your empty search filed. Except someone uses the direct URL:
http://lucdejaeger.smugmug.com/search
See screenshot below. If you want to center this one also you need the extra margin-code.
Thanks for the screenshot. At first thought I could not imagine someone using the direct search URL, but well, you never know... I now also included the additional code and everything still works fine
Luc
Is it possible to remove the Refine Results field altogether?
If I could replace the options in that dropdown with terms more relevant to me, that would be ideal. Assuming that's not possible, I'd just as soon remove it.
Try this to remove the Refine-Button:
.sm-search-button-refine { display:none; }I'm not sure but i don't think that it is possible to add more search options. I also would like to change some, at least the Apperture-Setting (Why only above f16?) but i'm not using these options much, so i don't really care.Interesting... i can see that on my site too. If i use the url/search-page only photos are shown. If i use a search-content-block and use the same search phrase i'll get photos and galleries. If some one want to test it:
My search site is here - Search for 2014 and all you get is photos.
My custom search page is here - Search for 2014 and you get a gallery and some photos.
No idea why this is different...
EDIT: If you want to give it a try: use a custom URL in the navigation menu bar instead of the Search page: This should give you photos and galleries by default when using the system search site.
Sorry?
Try this (change colors to whatever you want, you can even use rgba(10,20,30,.5) if you like ) :
.sm-search-categories .sm-link-icon { color:red!important; } .sm-search-categories .sm-link-icon-label { color:yellow; }The remove "Refine Search" code worked like a charm! As did changing the category icon/words color. Thanks so much! Though upon further reflection, I opted to remove the categories/icons as the don't work as I like (see below about parameters)
.sm-search-categories .sm-link-icon { display:none!important; } .sm-search-categories .sm-link-icon-label { display:none!important; }When I'm on my search page it says in the browser tab | Smugmug Search. How do I get it to say Search | Imagery by Charly. Like yours says Search | phaserbeam.
To bring up the Galleries with the Images, I had to tweak it some by adding what's in red below.
myURL/search/?c=everything&n=smsitename&scope=node&scopeValue=0 (Whereas smsitename for me would be imagerybycharly)
I'm wondering if there's any way to change the parameters when it searches for Galleries. Meaning if one puts in a keyword that is in a Gallery name, they will show. But if they put in a word that's not, then it will show 0 galleries. For example: Architecture renders 2 galleries and 91 photos for me, whereas Building renders 0 galleries and 31 images. (not finished with keywords as of yet). When one puts in Building I'd like it to show all galleries that Building is found in the keywords. Make sense?
My apologies for not being more clear. What I'd like to do is change what it says above galleries or images that render from a search. For Example: When I put in Animals is states 2 galleries and 28 photos and videos. I'll never have up videos and would like to remove that. Would prefer 2 Galleries and 28 Images.
This is because i have created a page with a search content block and a keyword content block. The name of that page is "Search" (with upper case S!) because the name "search" (with lower case S!) is used by smugmug for the default search page. The first word is always the gallery/folder/page name.
My name is shown in title because i have setup the Site Meta Title in Account settings/Discovery/Search.
Once you have entered a search term on my Search-page the browser title will change to what you see on your site:
(search_term) | SmugMug Search - Mozilla Firefox
I don't think that you can change that.
Perfect! The odd thing is, I added all the code and now the main search field (before a search) is off-right.
I tried to reconstruct the code to use from everyone's posts and refinements. After a search, the search field is properly centered.
http://www.joinrats.com/search
Did you check this post?
Thanks, I had missed that set. Looks very nice now.
One last question. I have tweaked every border combo I can, and cannot find the adjustment that will equalize the borders (blue in the image). I need to reduce the top and right. Which code does that? I have worked with W3S and multiple changes to the border settings and cannot for the life of me get it. Thanks.
Looks like you have adjusted the space between the search result images using a margin. Instead of adjust top/left margins like:
.sm-search .sm-search-tile{ margin:20px 20px 0 0; box-shadow:rgba(10,10,10,0.8) 3px 3px 5px 0; border:1px }Solution 1 - You should change this to make all margins the same size:.sm-search .sm-search-tile{ [B][COLOR=Red] margin:10px;[/COLOR][/B] box-shadow:rgba(10,10,10,0.8) 3px 3px 5px 0; border:1px }These margins are also used for the full preview if you move the mouse over it.EDIT: Solution 2 - You could also add this instead:
[COLOR="Red"][B].sm-search .yui3-overlay-content.yui3-widget-stdmod .yui3-widget-bd .sm-search-tile { margin:0px; }[/B][/COLOR]I also changed this on your site:
.sm-search .yui3-overlay-content.yui3-widget-stdmod .yui3-widget-bd{ border:5px; box-shadow:rgba(116,120,122,0.9) 3px 3px 4px 4px; background:rgba(237,248,255,0.90); padding:10px 11px 11px 10px; [COLOR=Red][B] /* For solution 1 */ margin:-20px 0px 0px -20px; /* For solution 2 */ /* margin:-10px 0px 0px -10px; */[/B][/COLOR] -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px }Now the preview open nearly at the same position as the result-image.EDIT: The margins in this part will only move the preview on the page, they will not change the "border" around the preview image.
Well I believe if I pay more for SM to have my own URL minus smugmug, then SM should be nowhere on my site. I mean, I not only pay for SM, but a web host that has no site on it just to be here with my URL. With all the wasted time I have put into my website both with Legacy and New, I could've paid some one to build a site the way I wanted it and not even be with SM at all. Just on my web host.
BTW, (search term) | SmugMug Search - Safari too. So on all browsers I'd say.
I was curious enough to check and the browsers I use (IE11, Chrome, Firefox) no longer show a title in the window.
--- Denise
Musings & ramblings at https://denisegoldberg.blogspot.com
SmugMug only appears on the Search page and still does...
Gasp and Thanks SO Much.
Who knew. lol on the borders which I had worked into a lather on W3S.
An interesting find: I have a search block on the 404 page (which has other customization as well). The CSS you provided, is showing up in the CSS block on that page. Yet I had added it only to the main Search page.
Isn't that interesting? I thought that content blocks could not be shared when one has "make this page separate" in place.
Denise, I do have a Business account, thus why I shouldn't see SM anywhere on my site, in my opinion. There should definitely be a way to stop that. Be it from a hack or on SM's end where I think it could be changed if they had a mind to. It shouldn't be that difficult as they turn it off everywhere else easily enough. I'm not happy that they don't have a mind to.... Even with phaserbeam's built search page it shows and I think it's because we have to use SM search parameters no matter what. Or maybe I'm wrong here?
No title in window? That's odd as it shows in both FF and Safari for me.