The "No Dev Question is Stupid" Thread - Basic HTML / CSS / Etc.

Joined
Dec 31, 2016
Messages
253
Likes
144
Degree
1
Thanks @turbin3 , I got it to work easily with Requests and BS.

Another question and this might seem too basic, but isn't for me.

I want to make a "You might also be interested in" shortcode for Wordpress. I don't have problems with the php part, but the .css is infuriating.

I want to show a rectangle with 1/3 being an image, 2/3 a box with text in it.

Like this one:


I can't get the divs to line up using percentages, they overlap. If I use fixed width then they float the following text (float: left). I can't get the "clearfix" to work.

This might be very basic, but can you refer me to something for making a div like the one at the div?
 

Ryuzaki

女性以上のお金
Staff member
BuSo Pro
Digital Strategist
Joined
Sep 3, 2014
Messages
2,969
Likes
5,443
Degree
7
@ragnar, you're saying your div's are overlapping with percentages, which makes me think you're having the classic problem with the box model.

What happens is you apply a percentage-based width to the main area, but then if you add on padding and margin and a border, that's extra width. So you may have taken care to add up the internal widths like 66.66% + 33.33% = 100%, but as soon as you add padding / margin / border, you go over 100%.

The easiest way to fix this is to make it so the padding, margin, and borders are considered in the calculation of the general width. It will automatically adjust the width to accommodate those extra widths so you don't have to get into a ton of funky math. The way to do that is:

Code:
box-sizing: border-box;
Apply that attribute to both boxes and you should see it all fall into alignment without any other intervention, if I'm understanding correctly.

A lot of CSS guys will apply that universally at the start of a project and never worry about it again like this:

Code:
html {
    box-sizing: border-box;
}

*, *:before, *:after {
    box-sizing: inherit;
}
You would only do this if you're creating a theme or design from the ground up, or it'll destroy the current design.
 
Joined
Oct 9, 2014
Messages
578
Likes
1,137
Degree
2
There are many ways to do it of course. One that can work well is Flexbox. Especially where the use case is "2D" in nature. In short, you basically:
  • Put everything in a parent element (let's just say a div) and set to display flexbox.
  • Align items on the parent element however you want.
  • Set your desired custom CSS on each element individually.
  • Maybe add media queries to make things look nice on mobile.
Let's say this is the element and surrounding text from your example image above:
Code:
<h1>Intelligent automatic boxes placement</h1>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
    <div class='related-content-box'>
        <div class='related-post-img'>
            <img src="https://placehold.it/600x100" alt="">
        </div>
        <div class='gray-box'>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Esse, obcaecati. Voluptatibus odit debitis veritatis.</div>
    </div>
First we take care of the flexbox setup for the parent element:
Code:
.related-content-box {
    display: flex;
    align-items: center;
    justify-content: center;
}
Then we customize each child component a bit:
Code:
.related-post-img {
    max-width: 100%;
}

.gray-box {
    background: #efefef;
    padding: 1rem;
    margin: 1rem;
}
Lastly, we throw in a media query:
Code:
@media screen and (max-width:990px) {
   .related-content-box {
       flex-wrap: wrap;
   }

   .gray-box {
       flex-basis: 100%;
   }
}
That's pretty rough, and I'm sure could be done better. You'll want to do some browser testing, and determine if you're going to need any fallbacks. I'd always recommend checking "Can I Use" for specific things like this. If most of your users are on newer browsers, there shouldn't be much of any issue, as flexbox is widely supported now. Here's a great guide to Flexbox.
 
Joined
Dec 31, 2016
Messages
253
Likes
144
Degree
1
Coding is so fun, I wish I had stuck with it when I was 10 and coded my first Qbasic programs, alas it was deemed "too nerdy" and no support from parents.

I just spent some hours writing a script in php (a first there, only python previously), to grab affiliate earnings from a network api and then write it to a database, so I could get it to my Google Dashboard (next up, scrap Google, write my own dashboard).

It's a lot of fun and time flies, but on the other hand, at my age, I will never be near good enough to sell it on the market. A regret for sure.
 

CCarter

If they cease to believe in u, do u even exist?
Staff member
BuSo Pro
Boot Camp
Digital Strategist
Joined
Sep 15, 2014
Messages
2,008
Likes
4,475
Degree
5
was deemed "too nerdy" and no support from parents.
You think most of the people in tech were “supported” or “encouraged” by their parents? I can’t count the amount of times I was screamed at to get off the internet cause it was tying up the phone line and go outside. Eventually they gave in and got a second line - YEARS later.

It doesn’t matter your age, you are only defeated when you think you can’t anymore. All the people I ask coding/programming advice from are 10 years my senior, yet I probably have more coding time than most of them. What does that mean? Age is just a number in your head, and if you use the labels society gave you then you’ll find yourself saying “I can’t because I am (whatever)” for the rest of your life.

It’s time to throw the chains away. One day of freedom is better than a continued life of subserviency.
 

SmokeTree

Developer/Linux Consultant
BuSo Pro
Digital Strategist
Joined
Sep 23, 2014
Messages
192
Likes
321
Degree
1
It's a lot of fun and time flies, but on the other hand, at my age, I will never be near good enough to sell it on the market
That's just not true unless you really believe it. If you have already created a working script and you have the passion/drive, there's no reason you can't do this professionally. Just keep the things that are making you money on the front burner and work at the code, automating here and there for yourself first until you are confident you can do it for others. Being able to make your own tools is invaluable and if you stopped there and decided to never do it professionally, it's still time well spent.

I'll be totally honest here. I meet a lot of people that claim to have 10+ years of experience but many times that means that they have "1 year experience 10 years in a row" because they plateau after the first year and end up sticking to whatever crusty tech they first learned because that's "all they know" and honestly that's all they'll ever know because they think/act more like a human resources exec than a passionate dev and don't really know what they don't know.

yet I probably have more coding time than most of them
most... :smile:
 
Joined
Oct 18, 2017
Messages
21
Likes
6
Degree
0
I created a Wordpress instance using Bitnami on Amazon LightSail, but now I have no idea how to set up a domain to use the Wordpress install. All I see is a default Wordpress install when I visit the IP address that the Bitnami stack created.

How do I set up my domain in LightSail/Bitnami so I can host my blog there?
 

Ryuzaki

女性以上のお金
Staff member
BuSo Pro
Digital Strategist
Joined
Sep 3, 2014
Messages
2,969
Likes
5,443
Degree
7
I just Googled this while waiting on my ride to show up. I've not done this myself. But what I found sounds like you have a two step process.

You won't just punch in domain name servers at the registrar. You'll have to set up "A records" that point the domain to the IP address. And then to get the site running on the domain instead of the IP address, you'll have to edit the wp-config.php via an FTP client, changing out the values here from the IP to the domain name:
Code:
define('WP_HOME','http://example.com');
define('WP_SITEURL','http://example.com');
 

Apex

To the top
Joined
Jul 8, 2017
Messages
97
Likes
70
Degree
0
I want to learn a programming language that allows me to create web apps and web pages of the SAAS type. Mainly, I would like it to be an easy language to learn and that allows me to do things in the short term.

After several hours of searching, I've reduced my options to Ruby and Python, which look like good languages and the frameworks Rails and Django also seem very good. What do you think is the best option?
 

Ryuzaki

女性以上のお金
Staff member
BuSo Pro
Digital Strategist
Joined
Sep 3, 2014
Messages
2,969
Likes
5,443
Degree
7
@Apex, Python is older. They're both easy to read and type, with Ruby trying to kick that up a notch. When I tried to learn Ruby I kept getting disappointed by it's inability to do certain things (like create a self-packaged app) and how little documentation there was out, including finding answers on Stack Exchange and all that. Python seems to have a much larger base of users at this point with much more help already available.

That may have changed in the 7+ years or whatever it's been since I messed with Ruby. It was pretty hipsterish and new at that point.

There's a lot of Javascript options out there these days. @turbin3 talks about them, like ReactJS and other frameworks.

There's still PHP too.
 

SmokeTree

Developer/Linux Consultant
BuSo Pro
Digital Strategist
Joined
Sep 23, 2014
Messages
192
Likes
321
Degree
1
What do you think is the best option?
Years ago, I would have told you to learn Ruby/Rails. The documentation for Rails was massive and you could pretty much do just about anything you needed to do on the back-end with it. Ruby as a language is very straightforward and beautiful to work with. I made a living using Ruby/Rails for Web Apps and C# for desktop apps for about a decade. The main problem with Ruby is it's a slow language in comparison to just about any other scripting language out there. There have been recent improvements that are going to change this dramatically but currently Ruby/Rails just doesn't do well in the performance/scaling dept which can cause you to have to solve a lot of the problems with better hardware to make up for the lack of performance of the lang itself.

Since you've limited your choices to two, to answer your question my choice would be to go with Python and Django. You really can't go wrong with that combo. You'll also need to learn JavaScript because that's unavoidable for web apps.

For me personally, I love the Elixir language (https://elixir-lang.org/) and Phoenix Framework (http://phoenixframework.org/). I've made quite a few small apps for clients in just the past 2 years and I have nothing but good things to say about the performance and fault tolerance. It's a different breed and in a class of it's own, handles multiple processor cores by default and scales with almost zero effort. I would like to give thanks to the alien lizard people that created it because it's making me money and a very happy dev.

At the end of the day, don't limit yourself to one language. Learn to program, not to "program in Language X", you'll be happier :smile:
 

turbin3

BuSo Pro
Joined
Oct 9, 2014
Messages
578
Likes
1,137
Degree
2
What do you think is the best option?
I'm curious. Are there specific factors that made those seem the most attractive for something you're looking to achieve? The exact languages and frameworks are less important in most cases. You can build things and make money with just about any language. It's usually most effective matching those choices based on fundamental needs and constraints.

I have almost no experience with Ruby (save for SASS usage) or Rails, so I can't really comment on those.

Python > Django
For me, I use Python frequently for web-scraping purposes, processing files and manipulating data. So, in my case, Django has made a lot of sense to use on the backend. It has its cool value props, but it has plenty of downsides as well.

For example, the standard template/view system is getting a bit antiquated these days, with sites needing much heavier JS framework usage on the front-end. These days, the front-end is just as complicated as the back-end. For an MVP, though, Django can still work well. Sometimes just being able to quickly add custom functionality is well worth it.

Also, Python has its own weirdness, just like any other language. For example, forced whitespace. Also, managing Python versions (learn to love the virtualenv!). I've still found, if you use simple logic with Python, and don't try to get too creative, it can be easy to learn and reason about.

PHP > Wordpress
For those that use PHP as their go-to solution, Wordpress is the natural choice. People hate on Wordpress all day long. I'm usually one of them, though I still use it for a few sites.

Whenever the subject of WP comes up, I've started making an effort to remember a specific question about marketing.
What's the ROI?
For some, the ROI of Wordpress is barely worth their $5/mth shared hosting cost. Maybe a static site might be better for them.

For The Wirecutter, the ROI of Wordpress was $30M.

If a WP site can sell for thirty million dollars, the tech ain't exactly the limiting factor. :wink:

If speed to market is a critical factor, and you don't have any highly custom needs, I'd still have to say WP is one of the most effective options.

Narrowing Down Fundamental Needs
Based on what you said, these seem to be a few of the fundamental needs you've mentioned:
  • Easy to learn
  • Productive to use
Other questions I'd ask are:
  • Would you be using these skills for anything else?
  • Think you'll freelance in the future?
  • Think you'll look for jobs with those programming skills?
Knowing those things will help make your choices easier. For example, say you'll definitely look to find a full time job programming in the language/framework of your choice. You'll find far more opportunities with PHP and Wordpress than just about anything else.

Even if not Wordpress, PHP has a bunch of other great opportunities for work. Laravel has become the framework to use in that world. Also, there a number of other CMS', both flat file or database-driven, built with PHP (Grav, Pyro, October).

There's still plenty of opportunities for Ruby and Rails, though it's popularity has been declining considerably.

Python and Django seem to have picked up in popularity over the past couple years at least. Still, the opportunities for finding work with Django are a fraction of the percentage of Wordpress.
 

Apex

To the top
Joined
Jul 8, 2017
Messages
97
Likes
70
Degree
0
There's a lot of Javascript options out there these days. @turbin3 talks about them, like ReactJS and other frameworks.
Javascript is also an option that I've thought about, but I've read that the available frameworks are mostly quite young, although I don't think it's a very negative factor either.

At the end of the day, don't limit yourself to one language. Learn to program, not to "program in Language X", you'll be happier :smile:
I don't want to limit myself to one language, but I've to start somewhere, and I would like to do it on the right foot :D

I'm curious. Are there specific factors that made those seem the most attractive for something you're looking to achieve?
From what I've read, they're easy to learn languages, they are not complicated to read, they've enough frameworks and they're also options that are not new or fruit of the "hype".

Other questions I'd ask are:
  • Would you be using these skills for anything else?
  • Think you'll freelance in the future?
  • Think you'll look for jobs with those programming skills?
  • The only thing that interests me now is everything related to web apps. I don't need to program desktop applications, for example.
  • For now it's not in my plans.
  • For now it is not in my plans.
 

Rageix

BuSo Pro
Joined
Jan 11, 2017
Messages
94
Likes
102
Degree
0
I want to learn a programming language that allows me to create web apps and web pages of the SAAS type. Mainly, I would like it to be an easy language to learn and that allows me to do things in the short term.

After several hours of searching, I've reduced my options to Ruby and Python, which look like good languages and the frameworks Rails and Django also seem very good. What do you think is the best option?
I've been doing web development professionally for several years now, and I've touched most of the languages out there. I've worked on many projects in PHP, Python, Javascript, and Go.

The first thing you need to know is, there is a lot to learn no matter what way you go, and all languages have up and down sides. That being said, every language mention can get the job done one way or the other.

In terms of ease of use PHP or Python would be great picks. Both have large communities of developers and any question you could think of asking has an answer. If I had to give an edge to someone starting out it would have to be PHP, because frankly it's just easier to get out and get deployed when you first get started. There are a lot of cheap PHP hosts where you can just throw stuff and and go. Python isn't harder to deploy once you know what you are doing, but there aren't many hosts that just have Python environments set up ready to go. If you use something like Docker the point is moot.

If you are dead set on Ruby or Python, then I'd say Python. Django and Flask are both great frameworks that can get a lot of stuff done. If you ever got interested in doing things like machine learning then there is lots of Python stuff around that too. Python is used for all kinds of stuff so it strikes me and the more broad language.
 

Steve

BuSo Pro
Joined
Dec 29, 2016
Messages
56
Likes
51
Degree
0
Go with what you know.
Failing that, go with what's popular and well documented.

Given your situation I would go with laravel (PHP). The framework is comprehensive, very popular, has great documentation and tutorials (look at the free ones on laracasts**), and despite some valid bad points, PHP is a decent language for web stuff. Since v7 it's also pretty fast as far as scripting languages go. The laravel framework promotes producer worker queues for long running tasks, which fits well with many SAAS designs, and should you need to do a bunch of heavy tasks that PHP can't handle fast enough, it's pretty simple to rewrite you workers in something blazing fast like golang.

**This site alone could sway the argument if you are a complete beginner. Even if you don't want to use laravel, give it a look. Very well done tutorials, all the beginner ones are free.
 
Last edited:
Joined
Dec 31, 2016
Messages
253
Likes
144
Degree
1
I'm not at a level of being able to make advanced web apps in any language, but I can write tools for myself and set up basic web apps in say Django.

From that perspective, as a recent noob who learned without compsci training, I'd give a plus to Python and PHP.

The plus with Python is the pletora of excellent beginner tutorials which, along with a minimalistic and 'pretty' syntax, makes it easy to grasp coding basics like loops and objects. One thing lacking imo with Python is the intermediate practical examples. There's a lot of basic stuff and then a lot of advanced compsci lingo advanced stuff. Not so much in between. What I mean is, there isn't that many tutorials or inspiration for making practical small web apps. It's like you go from handholding in beginning to hardcore technical lingo and implied knowledge from experts. That was my experience. I also honestly found much of the MVC object stuff in Django to be overkill for simple webapps of the type I am talking about. Flask can get around some of this for sure.

Compared to PHP which reallt has a lot of simplish practical web app stuff which is relevant to us as online marketers. If you want to make some practical tool for linkbait or calculators etc for example, then you will probably find it quicker and easier with PHP. I'd also say that to me, there's really no need to reinvent the wheel if you're not in the wheel business or car business. If you're in the transportation business, maybe it's better to invent an app like Uber, instead of building a car which can track customer orders, if you get the analogy. I find PHP and Wordpress to deliver a lot here with all of the building blocks, not only ready (like Django), but already assembled. With custom posts, I can do pretty much everything I want contentwise, no need to build from the ground up.

If I look at my objectives, it's content delivery plus extra functionality like faceted search, calculators, quizzes, maybe some kind of community. All this you can do with both plugins or php/jquery in Wordpress with little trouble. Particularly if you get a simple css/jquery theme that won't give you lots of conflicts.

I am sort of stuck in the "advanced beginner" stage and that's fine for now. I use coding to make tools and save lots of money there and to add some extra functionality to Wordpress sites. For those two purposes, Python and PHP serves me perfectly. I can't comment on actual software development or customer targeted apps.
 
Joined
Apr 7, 2016
Messages
237
Likes
142
Degree
1
I changed the slug of a page in wordpress and now it redirects the old url to the new one. I don't want this to happen because I want to replace an archive page to take the old urls place.

Ex) old slug "/reviews/" was changed to "/reviews-test/"
I have a new custom post type archive that I want to take its place "/reviews/"

I was using the the redirection plugin
Code:
https://redirection.me/
and it wasn't set to monitor page url changes, even if it had it should have shown in the redirection list however, there was nothing there. I checked my .htaccess file and there was nothing.

I cleared everything out of the plugin and deleted it. I also turned off all other plugins, including Thrive Architect and Yoast SEO.

Still having issues with this redirect. It's probably something obvious that I'm overlooking.
 
Joined
Oct 9, 2014
Messages
578
Likes
1,137
Degree
2
When changing slugs in Wordpress, a meta_key of "_wp_old_slug" is added to the wp_postmeta table in your database. This is a built in function of Wordpress.

The function "wp_old_slug_redirect" references "_wp_old_slug" and uses it to redirect to the new slug.

I'd check your wp_postmeta table and see if you can find a meta_key of "_wp_old_slug" with a meta_value of your old one. If you find it, just delete that row and the redirect should be disabled.

If you need help checking the table, let us know. Most hosts, especially shared hosts and hosts with Cpanels usually have something like phpMyAdmin available for this.
 
Joined
Apr 7, 2016
Messages
237
Likes
142
Degree
1
When changing slugs in Wordpress, a meta_key of "_wp_old_slug" is added to the wp_postmeta table in your database. This is a built in function of Wordpress.

The function "wp_old_slug_redirect" references "_wp_old_slug" and uses it to redirect to the new slug.

I'd check your wp_postmeta table and see if you can find a meta_key of "_wp_old_slug" with a meta_value of your old one. If you find it, just delete that row and the redirect should be disabled.

If you need help checking the table, let us know. Most hosts, especially shared hosts and hosts with Cpanels usually have something like phpMyAdmin available for this.
Thank you very much! I didn't know wordpress had that built in. I just recently learned SQL, so this worked out perfectly. My host has something similar to phpmyadmin that I was able to query.
 
Joined
Jun 24, 2015
Messages
21
Likes
16
Degree
0
I got a low pingdom result on posts with a lot of comments.

"Remove query strings from static resources" and it seems that gravatars are the problem. I managed to solve other page speed problems with plugins but not this one. Is there any code that can help me?
 
Joined
Jan 14, 2017
Messages
249
Likes
234
Degree
1
I am trying to run Ahrefs site audit on my Wordpress site, but the crawl fails every time. Ahrefs support says it is because their bot encounters a captcha on my site which prevents them from crawling.

My web host says that they are not blocking any bots, and according to their logs Ahrefs bot is landing on my site fine.

I also noticed that when I put my site into Ahrefs site explorer instead of showing my site's title, it just says Captcha.

I have tried deactivating plugins but it's still not working.

Any ideas on what could be causing this?
 
Joined
Dec 24, 2014
Messages
354
Likes
227
Degree
1
I am trying to run Ahrefs site audit on my Wordpress site, but the crawl fails every time. Ahrefs support says it is because their bot encounters a captcha on my site which prevents them from crawling.

My web host says that they are not blocking any bots, and according to their logs Ahrefs bot is landing on my site fine.

I also noticed that when I put my site into Ahrefs site explorer instead of showing my site's title, it just says Captcha.

I have tried deactivating plugins but it's still not working.

Any ideas on what could be causing this?
I'm no expert on this but my initial thought is that the issue could be related to using a CDN
 

Ryuzaki

女性以上のお金
Staff member
BuSo Pro
Digital Strategist
Joined
Sep 3, 2014
Messages
2,969
Likes
5,443
Degree
7
I got a low pingdom result on posts with a lot of comments.

"Remove query strings from static resources" and it seems that gravatars are the problem. I managed to solve other page speed problems with plugins but not this one. Is there any code that can help me?
The reason they don't want you to have query strings is because those don't get cached by the browser or CDN.

That's a good thing to know if you're using all kinds of layers of caching and trying to make a minor CSS change, for example. Having a query string like style.css?v=1.03 and incrementing it to style.css?v=1.04 helps you push the updates without having to flush the caches each time you test something.

The query strings on Gravatar avatars usually refer to which size you're pulling in, the rating like Rated R or Rated G, and sometimes whether or not it's a default avatar or a custom one.

You CAN remove all of that, but you're going to end up getting a lot of default avatars showing at possibly the wrong size. You'll get default because you can't request a minimum rating, so they'll only send you G ratings, and otherwise you get the default blue one. And you'll end up getting their default 80px one, which may not be the optimal size for your site.

If that sounds okay to you then you can use this, which I found online and didn't write myself:

PHP:
/**
 * Remove query string parameters from Gravatars
 */
add_filter( 'get_avatar_url', 'buso_avatar_remove_querystring' );
function buso_avatar_remove_querystring( $url ) {
    $url_parts = explode( '?', $url );
    return $url_parts[0];
}
But, i'd also tell you that the recommendation to remove query strings is only that. If Gravatar isn't being slow, then there's nothing to worry about. Each blog is likely to have comments from different users, and most visitors never visit more than one post at a time anyways.

If you care about the speed grade, then you could remove the query strings. If you care about the speed score, then I wouldn't worry if your score isn't slow. If you really care, I'd remove the gravatars altogether rather than just the query strings.
 
Joined
Mar 30, 2016
Messages
81
Likes
110
Degree
0
htaccess redirect with regex

Long story but I'm "inherited" a legacy site which is being migrated over to wordpress.

Currently most of the pages end with a ".shtml". I have kept the slugs the same, but they end with the "/" not ".shtml"

Using Regex, how do a I create a 301 redirect rule to have the ".shtml" to redirect to the "/"

example:
old url: abc.com/phone.shtml
new url: abc.com/phone/

There are a little over 200 pages and I don't want to create a line by 301 redirect.

Oh and one more. I want to change the blog slug. Currently its blog/year/date/title.shtml
old: abc.com/blog/2016/10/title.shtml
new: abc.com/blog/title/
 
Last edited:

Rageix

BuSo Pro
Joined
Jan 11, 2017
Messages
94
Likes
102
Degree
0
htaccess redirect with regex

Long story but I'm "inherited" a legacy site which is being migrated over to wordpress.

Currently most of the pages end with a ".shtml". I have kept the slugs the same, but they end with the "/" not ".shtml"

Using Regex, how do a I create a 301 redirect rule to have the ".shtml" to redirect to the "/"

example:
old url: abc.com/phone.shtml
new url: abc.com/phone/

There are a little over 200 pages and I don't want to create a line by 301 redirect.

Oh and one more. I want to change the blog slug. Currently its blog/year/date/title.shtml
old: abc.com/blog/2016/10/title.shtml
new: abc.com/blog/title/
Assuming Apache since it's Wordpress related.

Beware this is untested and may need slight modification to work.


Code:
.htaccess

RewriteEngine on
RewriteRule ^/(.*)\.shtml$ /$1 [NC]
RewriteRule ^/blog/(\d+)/(\d+)/(.*)\.shtml$ /blog/$1/$2/$3 [NC, L]