Hi,
Is there a way to move the edit the size of the livesearch macro?
For example, making it bigger similar to the search box on google home page.
Thanks in advance! :)
Actually this is possible, albeit through a workaround. You can modify every search box to be wider by adding some css to the Global CSS for confluence (via Admin area)
.plugin_livesearch_searchbox { width: 500px; }
If you want to change the size of a searchbox on a specific page, you can use the HTML macro (https://confluence.atlassian.com/display/DOC/HTML+Macro) and input some javascript to change all the search boxes on a specific page.
<script type="text/javascript"> AJS.$("document").ready(function(){ AJS.$(".plugin_livesearch_searchbox").css("width","500px"); }); </script>
Hope this helps!
This doesn't work for me. Is there something I have to change in the script for my specific page?
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Looks like we have changed the class used to address the search box (did I really write this 3 years ago!?)
Try this instead:
Single Page (with HTML macro)
<script type="text/javascript"> AJS.$("document").ready(function(){ AJS.$(".quick-search-query").css("width","500px"); }); </script>
Global
.plugin_livesearch_searchbox { width: 500px; }
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Works great but had to replace:
"quick-search-query"
with:
"search-macro-query"
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Unfortunately this doesn't work for me either.
If I use the HTML Macro it only shows the inserted code but does not apply it to the actual searchbar.
What am I doing wrong?
Thanks for your help!
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
It works for me, now.
The problem was, that confluence did not recognize < as <
The code I had to insert was:
<script type="text/javascript"> AJS.$("document").ready(function(){ AJS.$(".search-macro-query").css("width","500px"); }); </script>
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
I used the following code in an HTML Macro and it works perfectly.
<script type="text/javascript"> AJS.$("document").ready(function(){ AJS.$(".quick-search-query").css("background-color","#3c72ae"); }); </script>
Now I wanted to set it globally.
I used the CSS Format Template page in the admin center
http://domain.com/admin/viewstylesheet.action
My code is
.quick-search-query {
background-color: #3c72ae;
}
But it didn't work. I changed the name to "search-macro", "search-macro-query", "quick-search-query" and so on. Nothing did the job.
The sourcecode adresses "quick-search-query" like in my initial test.
I cleared all caches in my browser. Still no effect.
Any ideas?
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
As far as I know, there is no way to modify the size of it.
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.