News:

Wondering if this will always be free?  See why free is better.

Main Menu

How do I remove top search?

Started by marcie3, July 01, 2015, 01:12:08 AM

Previous topic - Next topic

marcie3

Hi my question is about removing the search box from the top right corner of our forum. I'm posting here because it's essentially the same question that was originally asked but we're using the default Curve theme on SMF 2.0.10. I'm not sure where the search box code starts and stops.

I have another question.  We're using the random news feature and the news block is right aligned and narrow for our news items. We would like the news left aligned, below the date, and have it take up the whole width of the heading area. Can someone help?

margarett

I split your post from the topic you posted in.

Both your questions are related in code... This is the block of code that shows both (index.template.php):
echo '
</div>
<div class="news normaltext">
<form id="search_form" action="', $scripturl, '?action=search2" method="post" accept-charset="', $context['character_set'], '">
<input type="text" name="search" value="" class="input_text" />&nbsp;
<input type="submit" name="submit" value="', $txt['search'], '" class="button_submit" />
<input type="hidden" name="advanced" value="0" />';

// Search within current topic?
if (!empty($context['current_topic']))
echo '
<input type="hidden" name="topic" value="', $context['current_topic'], '" />';
// If we're on a certain board, limit it to this board ;).
elseif (!empty($context['current_board']))
echo '
<input type="hidden" name="brd[', $context['current_board'], ']" value="', $context['current_board'], '" />';

echo '</form>';
// Show a random news item? (or you could pick one from news_lines...)
if (!empty($settings['enable_news']))
echo '
<h2>', $txt['news'], ': </h2>
<p>', $context['random_news_line'], '</p>';

echo '
</div>
</div>
<br class="clear" />';

To remove the quick search is actually easy, just remove the code between "<form ......" and "</form>"

To have the news occupying the whole forum requires some more changes. If you change all that code to
echo '
</div>
</div>';
// Show a random news item? (or you could pick one from news_lines...)
if (!empty($settings['enable_news']))
echo '
<div class="news normaltext">
<h2>', $txt['news'], ': </h2>
<p>', $context['random_news_line'], '</p>';

echo '
</div>
<br class="clear" />';

Should work (although I'm not sure if there are related XHTML validation errors, as I seriously suck at theming :P )
Se forem conduzir, não bebam. Se forem beber... CHAMEM-ME!!!! :D

QuoteOver 90% of all computer problems can be traced back to the interface between the keyboard and the chair

marcie3

Thank you so much, margarett, for the quick and very helpful response. Your coding worked perfectly.

May I now trouble you (or anyone else) for another modification to our news section? Some of our news items are longer than others and they are "bleeding" down over the bottom blue border of the space allocated to the news and into the space below the news section where the main menu items (Home, Help, Search, etc) are located. THis is especially the case for anyone with a narrow monitor or anyone who is zooming to show large text.

Is there some coding that will adjust the height of the News space depending on how much text or graphics is in it?

margarett

#3
Yes, I see the problem. Basically the header isn't growing vertically to accommodate all that text. Trying to find that in CSS...

edit: no, can't find it :(

edit2: yeah, it seems to be because of the background image
http://www.simplemachines.org/community/index.php?topic=507917.0

Not really sure of a way to fix this, my suggestion is to use the news fader (although that one just shows in BoardIndex...)
Se forem conduzir, não bebam. Se forem beber... CHAMEM-ME!!!! :D

QuoteOver 90% of all computer problems can be traced back to the interface between the keyboard and the chair

Sir Osis of Liver

You can remove search by doing this -

/css/index.css



/* Styles for the basic search section.
------------------------------------------------- */
#search_form, #simple_search p
{
padding: 0.5em;
margin: 0;
        display: none;
}



But note that there appears to be an error here.  index.template.php calls this style as search_form, here -



<div class="news normaltext">
<form id="search_form" action="', $scripturl, '?action=search2" method="post" accept-charset="', $context['character_set'], '">



but in the original css, it's searchform -



/* Styles for the basic search section.
------------------------------------------------- */
#searchform, #simple_search p
{
padding: 0.5em;
margin: 0;
}



Will have a look at news in a bit.

Ashes and diamonds, foe and friend,
 we were all equal in the end.

                                     - R. Waters

margarett

Actually I think I found a fix for you, it involves the news fader but it can be shown everywhere :)

In BoardIndex.template.php, find and remove
// Show the news fader?  (assuming there are things to show...)
if ($settings['show_newsfader'] && !empty($context['fader_news_lines']))
{
echo '
<div id="newsfader">
<div class="cat_bar">
<h3 class="catbg">
<img id="newsupshrink" src="', $settings['images_url'], '/collapse.gif" alt="*" title="', $txt['upshrink_description'], '" align="bottom" style="display: none;" />
', $txt['news'], '
</h3>
</div>
<ul class="reset" id="smfFadeScroller"', empty($options['collapse_news_fader']) ? '' : ' style="display: none;"', '>';

foreach ($context['news_lines'] as $news)
echo '
<li>', $news, '</li>';

echo '
</ul>
</div>
<script type="text/javascript" src="', $settings['default_theme_url'], '/scripts/fader.js"></script>
<script type="text/javascript"><!-- // --><![CDATA[

// Create a news fader object.
var oNewsFader = new smf_NewsFader({
sSelf: \'oNewsFader\',
sFaderControlId: \'smfFadeScroller\',
sItemTemplate: ', JavaScriptEscape('<strong>%1$s</strong>'), ',
iFadeDelay: ', empty($settings['newsfader_time']) ? 5000 : $settings['newsfader_time'], '
});

// Create the news fader toggle.
var smfNewsFadeToggle = new smc_Toggle({
bToggleEnabled: true,
bCurrentlyCollapsed: ', empty($options['collapse_news_fader']) ? 'false' : 'true', ',
aSwappableContainers: [
\'smfFadeScroller\'
],
aSwapImages: [
{
sId: \'newsupshrink\',
srcExpanded: smf_images_url + \'/collapse.gif\',
altExpanded: ', JavaScriptEscape($txt['upshrink_description']), ',
srcCollapsed: smf_images_url + \'/expand.gif\',
altCollapsed: ', JavaScriptEscape($txt['upshrink_description']), '
}
],
oThemeOptions: {
bUseThemeSettings: ', $context['user']['is_guest'] ? 'false' : 'true', ',
sOptionName: \'collapse_news_fader\',
sSessionVar: ', JavaScriptEscape($context['session_var']), ',
sSessionId: ', JavaScriptEscape($context['session_id']), '
},
oCookieOptions: {
bUseCookie: ', $context['user']['is_guest'] ? 'true' : 'false', ',
sCookieName: \'newsupshrink\'
}
});
// ]]></script>';
}

Then go to index.template.php. In the code we discussed before, this:
echo '
</div>
</div>';
// Show a random news item? (or you could pick one from news_lines...)
if (!empty($settings['enable_news']))
echo '
<div class="news normaltext">
<h2>', $txt['news'], ': </h2>
<p>', $context['random_news_line'], '</p>';

echo '
</div>
<br class="clear" />';

Should just become this:

echo '
</div>
</div>
<br class="clear" />';


Then find this

// The main content should go here.
echo '
<div id="content_section"><div class="frame">
<div id="main_content_section">';

And turn it into this
// The main content should go here.
echo '
<div id="content_section"><div class="frame">';

// Show the news fader?  (assuming there are things to show...)
if ($settings['show_newsfader'] && !empty($context['fader_news_lines']))
{
echo '
<div id="newsfader">
<div class="cat_bar">
<h3 class="catbg">
<img id="newsupshrink" src="', $settings['images_url'], '/collapse.gif" alt="*" title="', $txt['upshrink_description'], '" align="bottom" style="display: none;" />
', $txt['news'], '
</h3>
</div>
<ul class="reset" id="smfFadeScroller"', empty($options['collapse_news_fader']) ? '' : ' style="display: none;"', '>';

foreach ($context['news_lines'] as $news)
echo '
<li>', $news, '</li>';

echo '
</ul>
</div>
<script type="text/javascript" src="', $settings['default_theme_url'], '/scripts/fader.js"></script>
<script type="text/javascript"><!-- // --><![CDATA[

// Create a news fader object.
var oNewsFader = new smf_NewsFader({
sSelf: \'oNewsFader\',
sFaderControlId: \'smfFadeScroller\',
sItemTemplate: ', JavaScriptEscape('<strong>%1$s</strong>'), ',
iFadeDelay: ', empty($settings['newsfader_time']) ? 5000 : $settings['newsfader_time'], '
});

// Create the news fader toggle.
var smfNewsFadeToggle = new smc_Toggle({
bToggleEnabled: true,
bCurrentlyCollapsed: ', empty($options['collapse_news_fader']) ? 'false' : 'true', ',
aSwappableContainers: [
\'smfFadeScroller\'
],
aSwapImages: [
{
sId: \'newsupshrink\',
srcExpanded: smf_images_url + \'/collapse.gif\',
altExpanded: ', JavaScriptEscape($txt['upshrink_description']), ',
srcCollapsed: smf_images_url + \'/expand.gif\',
altCollapsed: ', JavaScriptEscape($txt['upshrink_description']), '
}
],
oThemeOptions: {
bUseThemeSettings: ', $context['user']['is_guest'] ? 'false' : 'true', ',
sOptionName: \'collapse_news_fader\',
sSessionVar: ', JavaScriptEscape($context['session_var']), ',
sSessionId: ', JavaScriptEscape($context['session_id']), '
},
oCookieOptions: {
bUseCookie: ', $context['user']['is_guest'] ? 'true' : 'false', ',
sCookieName: \'newsupshrink\'
}
});
// ]]></script>';
}
echo '
<div id="main_content_section">';


And with this you have the news fader everywhere. The fader has a "problem" because it varies the height with the current news item being shown, which is undesirable. If you set a very high time for the "fade time", it will mimic the static and random news that you used to use ;)
Se forem conduzir, não bebam. Se forem beber... CHAMEM-ME!!!! :D

QuoteOver 90% of all computer problems can be traced back to the interface between the keyboard and the chair

Sir Osis of Liver

Or you can do something like this -

/css/index.css



#upper_section div.news
{
width: 90%;
float: left;
text-align: left;
margin: 20px 0 0 10px;
}



Just a matter of putting it where you want it.
Ashes and diamonds, foe and friend,
 we were all equal in the end.

                                     - R. Waters

margarett

Yeah, my CSS skills are really... ermmmm, non existent :P
So I hack PHP until it works ;D
Se forem conduzir, não bebam. Se forem beber... CHAMEM-ME!!!! :D

QuoteOver 90% of all computer problems can be traced back to the interface between the keyboard and the chair

marcie3

Krash, since I already used the fix that margarett provided for removing the search at the top of the pages, and it worked, I should probably leave well enough alone for that one... unless either of you see a problem.

margarett and krash, since my php and css skills are both non existent, I'm not sure which of your solutions to the "vertical" news space issue I should use. krash, if I use your code in the index.css file, what do I need to replace?

I found code in the file that says:

#upper_section div.news [nofollow]
{
   width: 50%;
   float: right;
   text-align: right;
}

I replaced it with your code and did a hard refresh and it didn't seem to change anything.

Lower down in the index.css file I found other code that references the div.news [nofollow]. Do I need to change any of that?

div#upper_section div.news [nofollow] p
{
   display: inline;
}
div#upper_section div.news [nofollow] form
{
   padding-bottom: 10px;
}
/* clearing the floats */
#top_section
{
   min-height: 65px;
   overflow: hidden;
   margin-bottom: 3px;
}
#upper_section
{
   overflow: hidden;
}

Sir Osis of Liver

It's simpler and cleaner to modify css wherever possible, rather than hack templates (which was my preferred method until I learned some css), but either will work.

If you use css to remove search, and change #upper_section div.news to what I posted, it should move the news item to left side below userarea, above main menu, and extending across almost to right margin. 

If you're not seeing css changes, your browser is probably caching the original.  Try clearing history, close/open browser, or have a look in different browser.  You can prevent browser caching by putting this in your forum root -

.htaccess



# NEVER CACHE
<FilesMatch "\.(txt|htm|html|php|css)$">
Header set Cache-Control "max-age=0, private, no-store, no-cache, must-revalidate"
</FilesMatch>


Ashes and diamonds, foe and friend,
 we were all equal in the end.

                                     - R. Waters

marcie3

Thanks very much, Krash. I'll try the changes later this evening and report back.

marcie3

Ok. I didn't implement the "never cache" but I was able to see changes when I did a hard cache reset. I successfully used your suggested code, Krash, to remove the search button and move the news. Thank you.  EDIT: Oops, actually the Search button is still there. It just got moved from the top right to above the News on the left.

I'm still having the problem of the news item vertically extending down into the navigation buttons. See http://seniorlearn.org/forum/index.php [nofollow]

Can you think of a css fix?

Lower down in the index.css file I found other code that references the div.news [nofollow]. Do I need to change any of that?

div#upper_section div.news [nofollow] p
{
   display: inline;
}
div#upper_section div.news [nofollow] form
{
   padding-bottom: 10px;
}
/* clearing the floats */
#top_section
{
   min-height: 65px;
   overflow: hidden;
   margin-bottom: 3px;
}
#upper_section
{
   overflow: hidden;
}

margarett

Do note that I'm not sure if this particular issue can be fixed with css because of the background image...
Se forem conduzir, não bebam. Se forem beber... CHAMEM-ME!!!! :D

QuoteOver 90% of all computer problems can be traced back to the interface between the keyboard and the chair

marcie3

Thanks, margarett. Do you know if the person you were helping with this problem  ever created a workaround?

margarett

Errrrmmmm it was you I was helping :P
Se forem conduzir, não bebam. Se forem beber... CHAMEM-ME!!!! :D

QuoteOver 90% of all computer problems can be traced back to the interface between the keyboard and the chair

Sir Osis of Liver

Attach your index.css, will have a look.
Ashes and diamonds, foe and friend,
 we were all equal in the end.

                                     - R. Waters

marcie3

LOL, margarett. Sorry. Yeah it was Kindred who was helping someone in the link you posted ....http://www.simplemachines.org/community/index.php?topic=507917.0

Here's our index.css file




Sir Osis of Liver

Ok, simple stuff first -

Quote from: Krash on July 01, 2015, 08:14:35 PM


/* Styles for the basic search section.
------------------------------------------------- */
#search_form, #simple_search p
{
padding: 0.5em;
margin: 0;
        display: none;
}



But note that there appears to be an error here.  index.template.php calls this style as search_form, here -



<div class="news normaltext">
<form id="search_form" action="', $scripturl, '?action=search2" method="post" accept-charset="', $context['character_set'], '">



but in the original css, it's searchform -



/* Styles for the basic search section.
------------------------------------------------- */
#searchform, #simple_search p
{
padding: 0.5em;
margin: 0;
}



You didn't change #searchform to #search_form.  That's an error in the original css. 

Next thing - looks like you've modified the header to give it a lower border.  Can you reinstall the default index.template.php, and set up a test account I can use (registration is disabled).  Placing large images in the random news items is not really what it's designed for, but will see what I can do with it.

Ashes and diamonds, foe and friend,
 we were all equal in the end.

                                     - R. Waters

Sir Osis of Liver

Quote from: margarett on July 03, 2015, 03:18:58 AM
Do note that I'm not sure if this particular issue can be fixed with css because of the background image...

It is because of the background image, but it can be fixed (sort of) by modifying main_block.png.  Copy the attached to /Themes/default/images/theme/.  Save the original first.  There's still a limit to how far down your news article can go, but it gives you more vertical space.
Ashes and diamonds, foe and friend,
 we were all equal in the end.

                                     - R. Waters

marcie3

Ok. Krash. I've reinstalled the original index.template.php. The only change I had made was to delete the line that says "Show unread posts since last visit."

I've registered you as Krash on our site. I'll PM you the password. BTW, Guests can view posts and see what members see. They just can't post.

Advertisement: