Over the last week I have been learning how to edit pages for my website using Elementor. My vision for my home page included a heading photo of me in a tree, and overlaid text with my name and tagline. That process to create in itself was challenging, particularly because it requires a lot of tweaking in settings, and with the margins to get everything to come together. The image that I used was from the engagement photos my husband and I had done. I cropped him out of the image and made it a black and white to mask the color of his jeans that I wasn’t able to cut. The consequence was that I was now up against the margin, which made formatting difficult. Today I went back to the original and used other settings to edit it.
Here is the result:
Why I did it:
I needed to add some space between myself, and the edge of the photo. When you upload a photo in Elementor, there are 3 different sizes you can chose from: Cover, Contain, and Auto/Default. Auto/Default enlarges the photo, and in my case so much that you could only see the top of my head. Contain adds margin space on the left and right of the photo, which in my case ruined the arrangement of my text. Cover converts the image so that it fills the entire area of the image box. This creates the design I was going for. The problem is that in mobile and tablet view, the margins need to adjust, so I am no longer visible in either view. Elementor does have a feature that allows you to make adjustments specifically for each view, but that does not include changing the size of the photo as you imported it. It seemed that the best solution would be to figure out a way to add more of the image back so that I was not up against the margin.
How I did it:
I went back to the original photo and opened it in the Apple photo editor program. Instead of cropping my husband out, I used the retouch tool. For those unfamiliar with the retouch tool, it basically takes pixel colors from around the area you want to erase and blends them together. I did this in black and white so I wasn’t blending colors. After I was done, I saved the image, uploaded it, and inserted it into my cover photo.
Overall, I think the image looks a bit sify. I spent too much time trying to edit the photo, and I was having trouble with the image saving after I was done. It didn’t seem like I was able to undo a small section, rather hitting the undo button cleared out all of the retouching I had done. I did look at the tablet and mobile view, and I am displayed in both. I am going to play with other templates in Elementor using the original, edited photo I have been using all along.
Networking is about creating connections, and it’s those connections that often provide us with the most valuable opportunities to learn. There are many tools that exist to support network learning, but as Alec Couros mentions in his vide “The Connected Teacher” it isn’t the tool that we use, for those are ever changing. It’s the network that we create that is the important element in network learning.
Although tools are not the essential element in how network learning is supported, I am a supporter of GAP or “game/affinity paradigm”. The idea of gaming as a learning space often breeds controversy, because gaming often gets a bad rep. Many games (even those that promote violence) often require “gamers” to think strategically in order to participate. It’s in those affinity spaces that peer-learning evolves. A quote from the article “Accountable Talk and Learning in Popular Culture: The Game/Affinity Paradigm” references the game Portal by stating:
The game gives the player a new tool—the portal gun—which lets the player see the world in a new way and “surmise” new possibilities for solving problems. I cannot imagine a better vision statement for an educational institution in our highly complex, rapidly changing, high-risk global world.We need to ask why a company that makes an entertainment product has a better educational vision than many of our schools and colleges.
I think that as a society we need to be cautions of overlooking tools that promote networked learning.
Pomodoro Technique Day 2 Reflection:
I have been using the Pomodoro Technique all day. I wasn’t consistent with taking the breaks during the morning portion, and I didn’t cross over multiple projects the way I had planned. Part of the problem with the first 1/2 of my day was that I became engrossed with designing my website, and wanted to keep plugging along. When I did break it was just to check/respond to emails. I spent a solid 🍅🍅🍅🍅 across multiple pages of my website.
The second 1/2 of my day was a little different. I focused only on my FC101 page. I spent 🍅🍅🍅🍅 gathering my materials, and creating that page. I decided to take a bit longer break after that so I went for a run. When I returned I spent a 🍅 learning how to reformat my website across screens.
For the remainder of the evening I will be dedicating more time towards module assignments, and posts. Overall, I felt like it was a good tool for me to keep track of the time today. I need to make sure I am taking the breaks, and switching between projects more.
Today, I really immersed myself in designing my webpage. I learned about a number of features that Elementor has to offer. Some of the tools I learned from tutorial videos, while others simply by trial and error. Below are some of my experiences:
I learned how to manipulate existing templates and create new ones. Several of the header templates provided by Elementor are great starting platforms for a new page. Creating custom templates helps tremendously if you are looking for consistently within, and across all pages. Getting the exact font, style, color, etc. every time you add an element can be time consuming, so I used custom templates when I built my FC101 page.
Another feature that I found out about today was the “responsiveness” tool. I was disappointed the other day when I hopped on my home page from my iPhone, and discovered how disproportionate, and distorted my page looked from a mobil view. In a video tutorial I learned that while editing a page you can switch between mobil, tablet, and computer view. You can adjust your page specifically for each view without disrupting the other views. I’ve now adjusted each of my pages so that it’s mobile, tablet, and computer screen friendly(ish)- still needs work.
One of the most exciting accomplishments I made today was successfully embedding an Animoto project, and Glogster poster I created. I did this by dropping a HTML widget and uploading the link. I was shocked that both projects appeared on my web page. Luckily I had learned about margin adjustments, so I was able to format it.
I am excited about how my website is coming together.
This tutorial video gives instructions on how to save templates. I created templates and used them to build out my FC101 page today.
Pomodoro Technique Day 1 Reflection:
Today was my first day attempting to utilize the Pomodoro Technique. It wasn’t a great start, but I attribute a lot of that to the fact that my day didn’t necessarily go as planned either. I spent much more time in the office than I intended to, on projects unrelated to my 3 major projects for the week.
In addition, I am realizing that my Mac with all its cool capabilities, is quite distracting. I need to figure out how to disable all the pop up notifications that flood my screen when I am working. Most recently google started sending me notifications.
Nevertheless, I did complete a reading for Mod 4 using the tomato timer. I like how the countdown displays in the web browser. I also created my visual for the Mod 4 readings. Tomorrow I plan to structure my day much better so that I can put the Pomodoro Technique to the test.
Learn something new video journal #1
Overview of my experience following the tutorial video I posted. The file was too big so I had to export it with a lower resolution. Learning within my learning project.
Video tutorial on overlaying text onto images.