Tag Archives: week6

Learning to swim without floaties…and spell my own name

Tuesday’s class left me exasperated. I felt as if I had gone from floating in the shallow end of the pool with floaties on, to being thrown into the deep end.

The big picture was overwhelming me so I started to look at the smaller pieces one at a time. Since I couldn’t get Cyberduck to work in class, I decided to test it at home. After a number of unsuccessful tries, I reached out to Greg who pointed out that I had spelt my name wrong. Whoops. More tries ensued and still I was unable to connect. Once again, Greg had to point out that I had spelt my name wrong. By stressing about the big picture and rushing through it all, I had sent my brain into a panic and forgotten how to spell my own name. Twice.

This week made me realize that only so much of coding can be taught. At a certain point, I will have to start learning by pushing through the frustration rather than giving in to it. Of course my new rational mindset was quickly challenged when I decided to create a child theme of Twenty Twelve and mess around with it. There were so many different parts to it; I had no idea where to begin! Even though many of the things I tried to do didn’t work, I am eager to continue to familiarize myself with the code and expand my css/php knowledge. In trying to stylize my page, I discovered a neat tool (Image Color Extract) that determines the codes for all the colors found in an image – great for helping me get the exact look I want. I also realized that even though I had all sorts of questions, I knew the right words to search for the answers in the codex – a sure sign of progress!

After a few days of messing around with the code on my own, I’m not as panicked as I was on Tuesday evening. I’ve come to terms with how the learning process will go from here on out and am ready to buckle down. I’m not ready to start swimming without floaties, but I am definitely open to challenging myself by moving into the deep end of the pool. I may also sit down and practice writing my own name a couple times, just to make sure I’m not losing my mind.

Loads of Codes

After going through what seemed like thousands of free themes, I ended up choosing a WordPress theme that was already featured(go figure). Choosing my theme and getting a visual idea of what my site will look like really made me feel like we just matured from newborn to toddler. I was extremely excited, and then I started going into the files of my theme. In these files were loads of code, some that I understood immediately and others that I have a strong feeling will take me a while to figure out. I am still just as excited to get the ball rolling on this project, but we went from like 30 lines max in Codecademy to, in my case, 573 lines of CSS and that’s just one folder. Looking at all of the files was a little overwhelming and I must say, thank you Greg for NOT making us do this from scratch. I remember asking in the beginning of the semester why in the world other coders would share their codes for free. I look back now and wholeheartedly understand the reasoning. They do it for people like me and I’m extremely grateful these people exist!

What I found most interesting is that I thought I’d have more difficulty understanding the codes but I actually had more problems understanding the comments explaining the codes. Everything has an official/proper name that I’m sure all veteran coders know. For example, in Codecademy when we’d practice, I often found myself commenting like “change box thingy” or “moves grid thing to the left”. That kind of language won’t get me very far in the real world of code and also won’t aid in my understanding of what others are trying to pass along to me.

I meant to ask this in class but when we are in GitHub and preparing to update and sync things, I remember we have to write a note saying what that change does. I’m finding that I may know what something does, but I may not know exactly how to say it. I’m sure the solution to this is just practice, but I probably need to figure that out sooner than later.

Not So Breaking News: Child Themes reduce Headaches

To say that my life has changed since learning about child themes would be an understatement. I’m glad that I now know the proper way to edit styles, functions, and PHP code, on the other hand i’m upset that I have not been editing themes correctly since I first learned about WordPress.

My clients have had the misfortune of not updating their themes as they become available because I did not want to lose my styling edits in .css files and edits to html and javascript in .php files. That is one huge mistake I plan on correcting with my Web Dev Project: www.milagrocleaning.com.

I chose a theme titled Big Bang because I really found it to be a great representation of what I was looking for; a responsive and clean theme that will allow me to display the cleaning company in the right light. I think the theme is simple enough that it should allow me to make styling adjustments and edits that I deem necessary. The theme already includes a custom post type for portfolio items. I plan on adding a few custom input boxes on the custom post type portfolio to consistently display information like # of bedrooms, and bathrooms.

After looking through the different .php files in the theme, I am noticing a few discrepancies between what the theme creators have named the .php files as compared to the template hierarchy diagrams Greg has outlined in the readings for this week. It makes it a bit difficult to interpret what is actually in the files but I think I have a good understanding by looking at the code inside the .php files. It’s unbelievable to be in this position after a few short weeks of this web development class. I’m now able to differentiate and narrow down on specific pieces of code and see how I can alter things. I have yet to find redundant code or badly written code in the template .php files, but i’m sure I’ll find a few as no piece of code is perfect.

The inspector tool continues to be my best friend as it allows me to focus on a specific piece of code. I cut the class or id of a < div > or < p > tag and paste it into the child theme style sheet and override whatever the current style is. It almost feels like i’m cheating, which is worrisome because the last time I felt comfortable, JavaScript stepped up to the plate. I’m really proud with the progress I’ve made so far in the class. It couldn’t have come at a better time because my Advil was running low.  I’m positive my classmates feel the same way.

Getting More Acquainted with My Theme

It was great having Andy come in and speak to the class. While I didn’t grasp every single thing he was talking about, I now have a better understanding of the capabilities of WordPress. His discussion about child themes was especially useful for me. I’m happy he listed the 3-4 parent (and very basic) themes he recommends for creating child themes. I initially was thinking about using a very complex theme for my site, but I have now decided to go the more simple route with a theme called magazine basic.

After downloading my new theme, I spent some time looking through the various code and browsing the admin section. Since I’m creating a child theme, I know I definitely will have to create a new directly that includes a style.css file. But what about the other parent theme folders? Do I only drag the ones I want to edit into the child theme directory? I know I want to create a custom post type, which will be done through code, but what file do I create the code in?

I also spent some time trying to understand the differences between the local server and the web server, and how they “talk” to each other – for lack of a better word. I successfully connected to my local server and starting making very minor changes through the Admin section and was able to instantly view the changes on my local site (which was pretty cool!). But I’m having difficulty being able to view the changes on the web (even though I commit/synced files on GitHub and successfully connected to Cyberduck). Is it because I made changes through the Admin and not the code? My new theme is showing up, just not the text changes I made.

Ah.. so many questions still… but finally feel like I’m starting to comprehend what I’m doing.

Poking through a jungle of code

After a long, frustrating MAMP install, uninstall, reinstall, screw around with numbers and letters, rinse, repeat, MAMP still refused to work on my computer. I started from scratch on my girlfriend’s laptop, and voila! It worked. Now I could finally start playing around with the documents in my chosen theme, Eureka. I wasn’t feeling optimistic after three hours of banging my head against the wall with MAMP, but I’m glad I pushed through. It ended up being a lot simpler than I’d built it up in my head to be.

I was scared to touch the code at first! I did a lot of Command+F-ing for things like “border” and “background” and changing minor things to see if I was working in the right spot. I kept flipping back to the WordPress codex to try and decipher what I was looking at, and it took me a while to successfully make a change and see it reflected on my local host page. But I think the hardest part is over — now that I’m more comfortable with the workflow, I can concentrate on the actual content, look and functionality of the site. And It was cool to see my work show up right away on the page! I think I’ll be comfortable making cosmetic changes to the theme, but less so writing functions in PHP.

I love that the WordPress documents are separated out by their purpose rather than all being shoved into one CSS or PHP file. I think this will make it easy to find and change exactly what I want to, and the WordPress database system makes the PHP files clean enough to understand…kind of. I’m definitely going to keep studying those codex entries.

Veoni Vine

I had every intention of doing a portfolio website for my final project. I thought that improving my amateur-looking WordPress site would be the best use of my time. But after diving into HTML, CSS and JavaScript (cringe), I quickly realized that it would be more fun to build a site that incorporated all new content and focused on a true passion of mine.

Wine!

My husband and I like to think that we have a fairly exclusive wine collection, especially for a couple of 28-year-olds. We even have a few bottles that aren’t supposed to be opened for another 15-20 years. With that long of a wait, it’s difficult to remember where we got it, what food goes well with the wine, what year we should open it, etc. And let’s face it, in 20 years my memory is just going to get worse. So… my idea is to create an online wine cellar that houses all of our elite bottles with images, descriptions and food pairings. In addition to the wine cellar, the website would include a blog so I could document my wine experiences (such as visiting a winery, enjoying a good bottle of wine at dinner, highlighting a new local wine maker, etc.).

As far as the audience, my husband and I will benefit most from the site, at least at the beginning. But I plan on linking to blog posts from my social media channels so other people will know about the website. And who knows, maybe one day there will be a paid Virginia winery ad on the homepage. #winedreams

Post Updates
veonivine.com
Description: Veoni Vine will feature images and descriptions of my personal wine collection, as well as highlight my various wine experiences through custom blog posts.
Goals:
-Have a digital wine cellar that features prominent bottles from Italy and the US.
-Write blog posts to document my wine experiences (winery trips, dinners, etc.)
-Generate followers and encourage people to share comments on the blog posts.
Audience: My husband and I, friends and family, and hopefully other wine enthusiasts.
Achieving goals: I plan on using a WordPress template that is simple and is easily customizable. To ensure everything is organized nicely, I plan on creating custom post types. I also plan on sharing the website through social channels to drive awareness.
Theme: Magazine Basic (http://wordpress.org/themes/magazine-basic)
Functionality & Design:
-Create a child theme
-Develop a custom post type and taxonomies for ‘region’ and ‘year’
-Change the look of the theme by altering CSS code
-Import social media widget
-Add content (at least five collection bottles with images and descriptions, and one post highlighting winery experience).