MAGAZINE BASIC theme: Need help with Categories Menu, Please

How did you solve this? I would like to control which, if any, categories and pages are listed up top.

Hi,

I “solved” it by posting at least one article or post. Nothing else. Just dumb luck to get it to go back to the three-column layout again.

Sorry to disappoint!

Will

oops. misunderstood your question. I haven’t solved that issue yet, i.e. #2 and 3. only #1. Does that make me constipated, only doing #1?

How did you put your personal header up? Did you change the colors in the stylesheet?

Hi, Daniel:

Do you mean the header here: https://thatsjustplumdumb.com/wordpress/ ???

Will

If so, I used the theme Magazine Basic, which allows for a three-column layout plus ability to place my own logo in the header in place of any WordPress text. If you need further info, lemme know. Magazine Basic can be found here:
https://bavotasan.com/wordpress/free-wordpress-themes/magazine-basic-free-wordpress-theme/

Oh, I see you’re interested also in the header’s menu bar colors, yes? Those gradient-purples are actually two different files, one for the top in which the gradient goes dark to light starting from top, and the bottom one under my logo. I created a 1 x 34 pixel file and colored it the way I wanted (purple gradient), then uploaded it to the images folder of my theme. CSS code in the style.css file forces this 1-pixel wide file to repeat on the x-axis, so it flows all the way across the screen.

Awesome! Smart move. It looks good. Did you just replace the files in the image folder and it automatically switched them out or did you have to go ahead and change code as well?

I have two websites

DanielDickey.com

but just uploaded magazine basic for

matzahmatter.com

Hi, Daniel:

Grrreat blog! Lotsa energy and passion behind it. I’m proud!

Let’s see . . . what did I do to get me header up there? Hmmm . . . oh, I uploaded the header image I wanted, which was about 240 high x 1020 pixels wide, saved as good jpg . . . sent that image to the Magazine Basic theme’s UPLOAD folder, not the Images folder! I had to play around with it ’til I found the right place to put it. Anyway, just saved you ten minutes. : )

About the code: you only need to remove your Description, if you choose, so it doesn’t interfere with the logo image.

Lemme know how it goes: [email protected]

Will

Thanx so much…I also was wondering about the things you made and uploaded. I got the header part down, but wanted to know how you got the different colored bars up and running.

Once again great idea for a site!

I’ll answer this when i get back in town later today. . . .

Hi, Daniel:

The bars are actually gone now, but I can recall what I did: those gradient-purples are actually two different files, one for the top in which the gradient goes dark to light starting from top, and the bottom one under my logo. I created a 1 x 34 pixel file and colored it the way I wanted (purple gradient), then uploaded it to the images folder of my theme. CSS code in the style.css file forces this 1-pixel wide file to repeat on the x-axis, so it flows all the way across the screen.

Make sense? All you do is replace the existing file for that image that is turned into a bar that traverses the page. I’ll write more about the exact steps, but must write a report for now. . . .

Will

Hi, Daniel:

Here’s the code I used to get that bottom purple menu bar under the header logo. I’ve included some of the code above and below the pertinent code from the style.css file, so you can easily find it.

#title {
font-size: 52px;
margin: 20px 0 0;
padding: 0;
line-height: 34px;
}

#title a {
color: #6332A1;
}

#title a:hover {
color: #FF0000;
text-decoration: none;
}

#description {
font-size: 36px; color: #9B8BC1;
margin: 10px 0 15px;
padding: 0;
}

#navigation {
background: url(images/bottomlinepurple.png) repeat-x;
clear: left;
float: left;
width: 100%;
height: 25px;
}

ul.menu * {
margin:0;
padding:0
}

ul.menu ul {position:absolute; top:25px; left:0; background:#E6FFD1; display:none; opacity:0; list-style:none;}
ul.menu ul li {position:relative; border:1px solid #aaa; width:159px; margin:0}
ul.menu ul li a {display:block; padding:5px 7px 5px 12px; color: #5D5DA6; background-color:#E6FFD1; border-right: 0; font-size: 12px; }
ul.menu ul li a:hover {background-color:#E0D3FF}
ul.menu ul ul {left:159px; top:-1px}

as you can see, the code for the menu bar starts with #navigation. My image file for the bar is a 1 pixel x 34 pixel file called bottomlinepurple.png, which repeats to form a solid line.