Adicionar * nos campos obrigatórios da Loja Integrada

Opa :)

O formulário de cadastro da loja integrada é legal.. mas não tem os asteriscos de obrigatório... pra adicionar os * é só usar esse CSS:

.required label:after { content:" *"; }

Abraço!
Adriano Schmidt

Adicionar item no menu da Loja Integrada

Fala pessoal :D

No menu superior da Loja Integrada você consegue adicionar todas as categorias e/ou todas as páginas extras... mas só um item em específico não dá :(

Pra isso fiz um javascript (nesse caso também conhecido como enjambrascript hahah) para adicionar apenas um item no menu.

Basta alterar o label e o link e adicionar esse trecho de código lá na seção Minha loja > Incluir código HTML > Código no cabeçalho

<script>
$('#nivel-um').ready(function()
{
 var newItem = document.createElement("li");
 newItem.className += ' borda-principal';

 var newLink = document.createElement("a");
 newLink.className += ' titulo cor-secundaria';
 newLink.href = '/pagina/quem-somos.html';

 var textnode = document.createTextNode("Quem Somos");

 newItem.appendChild(newLink);
 newLink.appendChild(textnode);

 var list = document.getElementsByClassName('nivel-um')[0];
 list.insertBefore(newItem, list.childNodes[0]); //use esse para adicionar no inicio do menu
 //list.appendChild(newItem); //use esse para adicionar no fim do menu
});
</script>

Se precisar alterar algo de CSS, basta olhar o CSS do menu atual e ajustar no script e pronto :D

Vaaaleu!
Adriano Schmidt

yeoman gulp angular is not defined

Hi :D

I was trying to use the Yeoman to generate a project with AngularJS and Gulp

But the CSS was not working and on the console was the error "angular is not defined"



I was following this tutorial:
https://github.com/yeoman/generator-angular#readme

However, in order to fix the error I needed to change the gulpfile.js by this one:
https://gist.github.com/adrianoschmidt/ab0b74aa694fafe66de518a31f856b8a

That's all :)

Best regards,
Adriano Schmidt

Wordpress - How to change the base URL?

Hiiii,

I'm going to show you how to change the base URL of your wordpress.

First of all, you need to access your database and to run these commands:

use <put_here_the_name_of_your_database>;
select * from wp_options;

You will see lots of lines, we will change the lines with the column 'option_name' equals 'siteurl' and 'home'

In order to do that, run the next two commands with the new URL:

UPDATE wp_options SET option_value='http://newurl.com' WHERE option_name='siteurl';

UPDATE wp_options SET option_value='http://newurl.com' WHERE option_name='home';

After that, run again the select command to check if it is OK:

select * from wp_options;

That's all,

Best regards,
Adriano Schmidt

CSS - How to change all classes that begin with a certain string?

Hi :)

I needed to change all classes whose names begin with "icon-" for example: .icon-home, .icon-user, .icon-shopping-cart, .icon-th

and instead doing something like this:

.icon-home, .icon-user, .icon-shopping-cart, .icon-th, .icon-minus, .icon-plus, .icon-trash, icon-chevron-down, icon-signout {
    font-family: FontAwesome!important;
}

I did the same thing using this approach:

i, [class^="icon-"], [class*=" icon-"] {
    font-family: FontAwesome!important;
}

it is a little better :) regular expressions rocks :D

I don't know very well how it works, but you can read more here:
http://stackoverflow.com/questions/23963073/css-regex-selector-match-one-or-another-condition
https://css-tricks.com/attribute-selectors/

Best regards,
Adriano Schmidt

how to change the font-family of all elements?

hi :)

In order to change the font-family of all elements on your website, you could use that:

* {
    font-family: 'source sans pro'!important;
}

In my case, I would like to change only a few kind of elements:

a, span, input {
    font-family: 'source sans pro'!important;
}

But if you have icons that use another font-family like FontAwesome, you may force them to not use what you've set before

i, .icon-home, .icon-user, .icon-shopping-cart {
    font-family: FontAwesome!important;
}

.fa {
    font-family: FontAwesome-v4!important;
}

The "!important" was used to force the use of the font-family even if another font-family was set in another place
I often use the "!important" when I'm working in a platform like WordPress and I am changing/overwriting the theme...
On your website you should not use '!important'

Best regards,
Adriano Schmidt

Ionic - It is forbidden to downgrade devices which previously used M permissions

Hi :)

I have a project developed with Ionic, and when the mobile app was being published on play store, one error occurred:

This configuration cannot be published for the following reason(s):
It is forbidden to downgrade devices which previously used M permissions (target SDK 23 and above) to APKs which use old style permissions (target SDK 22 and below). This occurs in the change from version 100062 (target SDK 23) to version 100072 (target SDK 22).
Version 100062 is not served to any device configuration: all devices that might receive version 100062 would receive version 100072.

I don't know if it happened because the last version was generated in another machine or because we've put the crosswalk plugin in our project.

Well, in order to solve this problem, just put this line in your config.xml

<preference name="android-targetSdkVersion" value="23"/>

Maybe you will need to change the "23" for the version you want to use.

After that, you will generate again with "ionic build android --release" and that's all :D

Best regards,
Adriano Schmidt

how to map an image using html with the area tag?

Hi :)

I'm going to show you how to use the area tag to create a map of links in an html image.

It is very simple, you just need:

- to have an image where you will set the "usemap" attribute with your map's name
- to define the areas and the links inside of a map tag

Just like that:

<img src="url/to/your/image.jpg" usemap="#Map" />

<map name="Map" id="Map">
    <area href="#url1" shape="rect" coords="0,0,250,250" />
    <area href="#url2" shape="rect" coords="251,0,500,250" />
</map>

In this example I have an image with width=500px and heigth=250px
and the left half is a link to #url1
and the right half is a link to #url2

But I recommend you using a tool to generate these areas. That is a good tool: http://imagemap-generator.dariodomi.de/

---------------

If you want to learn more: http://www.w3schools.com/tags/tag_area.asp

---------------

And when you use a map, maybe you will see a blue border around your areas, if you want to remove these borders just put this code in your CSS:

map area{
    outline: none;
}

or just add

style="outline: none"

in each area that you create

---------------

And you can use another shapes instead using a rectangle, but I won't show here how to do that :(

---------------

That's all!
Adriano Schmidt

Retirar logo da Loja Integrada do rodapé

Bom, não é legalmente permitido isso, conforme mostrado nessa FAQ, porém, é útil mostrar isso para outras funcionalidades que vou mostrar a seguir.

Para retirar o logo da loja integrada do rodapé você pode adicionar esse código abaixo no "Editar CSS" da sua loja:

#rodape div .conteiner .row-fluid .span2 {
      visibility: hidden; display: none;
}

Mas não faça isso, não é permitido... porém mostrei pois da mesma forma, você pode fazer outras coisas como retirar o logo do "Integrando-se", empresa que vende temas, mas ao invés daquele código, use esse:

.integrandose {
      visibility: hidden; display: none!important;
}

Att,
Adriano Schmidt