Where should I begin with this?

[stylingpat]

Hello everyone, I'm new here!

I'm just reaching out to find out where I should go to find info like this. If this isnt the correct place, please feel free to redirect me to a different forum or community!

Real quick background. Spent years in my childhood age 10-17 building websites in notepad over 10+ years ago. Old school HTML during the AOL days. Learned CSS and it was like a godsend in those days.

So now. I'm back after all these years building a blog. And holy crap has WordPress just made web design so insane and easy now. Its really insane what you can do now. I couldnt imagine all the hours needed to code all that crap way back in the day. And my DragonBall Z and Pokemon websites took tons and tons of hours even with CSS making everything so much easier.

Sweet, this forum makes adding images easy! layfull:

So here is an image of my website below! This is just a WordPress theme. Where I have the orange color lines drawn in the header is what I want to add. Now my question is this.

Back in the day, this would be easy if it was in notepad. Just make the header into two tables, align them how you want and then just add your image to the right table. (I want to make a daily quote box)

Now that this is a wordpress theme. I feel kinda restricted into the layout of the theme. How do I go about using the superior usability of a WordPress theme but deal with these restrictions when I come across them? Should I just redesign the site in notepad? Its not that complex of a website and wont become that complex. Its just a blog, I'm not coding Amazon.

Website.jpg

Hopefully we can figure something out. And BTW, it feels really exciting to be back designing websites again. I loved it as a kid. Its an art form for sure. I remember all my HTML books from the bookstores and all that. Its a shame, I never saved all my websites from the good ol' Angelfire days haha.

Thanks guys!

[mlseim]

When you install a theme, each theme resides on its own directory. You will only modify files in the theme directory. Don’t touch other files as they are overwritten with Wordpress updates.

If you plan on updating the theme using the theme authors version update, any changes you made to those will be overwritten. So they created a thing call “child theme”. You can google it. I don’t use child themes, but I also don’t update the themes, only Wordpress.

You will modify the header.php file to add something in the header.

Anything you add won’t be writable with the normal Wordpress cms unless you use short codes and plugins.

You also have to keep your stuff styled to be responsive like the rest of the site so it renders properly on all screen sizes.

Wordpress is “ok”, but in many ways it sucks.

[stylingpat]

Interesting so I watched a few youtube videos. I learned about "inspect element" and header, footer, style.css and how they work together.

So here is a screenshot inside 'inspect element' where I added HTML code (its in the grey in the middle of the screen). That code is for the little text bubble on the upper right hand corner of the webpage.

screenshot1.jpg

Now when I go into my style.css on my wordpress website, I cant find where the hell to add this code to mirror where its at on the inspect element page. I cant even find that section of the 'inspect element' page on the style.css page.

[mlseim]

Are you inside the theme directory?
The path will look something like this ....

... Your url .... wp-content/themes/zenfire

i just made up zenfire ... Not knowing the real name of your theme

once you are in your theme directory, you will find the .css files.

it won't be as easy as your tutorial says. There could be 10 css files. Wordpress is bloated with dozens of css and javascripting. You will also be modifying .php files and don't forget about the infamous functions.php script.

wordpress really sucks for customizing stuff

an added f'd up thing about Wordpress.... It might cache css files so you won't see your changes unless you turn off caching or clear it each time. Good luck

[stylingpat]

I figured it out! It was totally hidden in a out of the way .php file lol

Is there a code I can add to my images to make certain images disappear once my website scales down to a certain size, like into mobile devices?

[mlseim]

That is done using CSS actually.

This explains it pretty well:
https://www.emailonacid.com/blog/art..._and_max-width

See this site ... view the HTML source to see how it is done:
Media Query Demos

[stylingpat]

Wow your a beast! TY!

[stylingpat]

I'm gunna sit down and learn CSS and JS skeletal structure, with so many code generators and resources on the internet, I dont think I need to know every command of CSS and JS like the back of my hand and off the top of my head, but knowing how the skeletal structure works will make it alot easier for what I'm doing with just my personal website.

[Greatforyou]

You can also download some coding tutorial apps on your phone, or even sublime to do some coding practice as well. I just downloaded it for my phone. It's been helpful. Also, not sure if you need the info, but I offered it to someone else on another thread. If you plan on redirecting your wordpress site I found www.redirectyourdomain.com pretty informative and helpful. What web host are using btw?