So, Im using wordpress.com to run my blog. I have paid for the upgrade with custom css. Now I want to change the formatting of posts that are on the front page. Ive been using the "inspect element" on Chrome, simular to Firebug, to see what class everything has and changing the CSS.
Its been pretty easy other than the posts. Each post, apparently has its own class.
my latest post is of class="post-190"
However, the post before it is class="post-188"
etc...
How do you write a CSS to include all of the post-##
You can use these attribute selectors
[class|=post]
an element whose "class" attribute has a hyphen-separated list of values beginning (from the left) with "post"
[class^=post]
an element whose "class" attribute value begins exactly with the string "post"
Source
From the basic TwentyEleven Wordpress theme let me suppose that you want to add border to this post, the structure of this class is forming from the wp-includes/post-template.php file.
This method is creating the class for this post -- get_post_class()
And then add styling to my content-aside.php page in the template, i hope this is what you are looking for, ley me know if u have an issue.
Related
I was inspecting a site's code to see how they styled a section of code in their page.
This is what I saw:
<code markup="tt">
I combed through the code to see if it was referenced any other time and it was only referenced in these code tags and there is no other reference to it in HTML or CSS.
(here's the link if you're curious: https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
I've been searching online, and I can't find this "markup=''" attribute anywhere. Can someone please explain what it is?
you may refer to https://www.w3schools.com/tags/tag_code.asp for more details on code tag , as explained, code tag accepts all the global attributes of HTML like class, id, name, data attributes and accepts event attributes like onclick, onerror etc. Hence markup is no solicit attribute for tag here, there are many JS frameworks like ReactJS wherein you can construct the customized attributes or rename existing attributes like class, name etc. to newer names like markup using a concept called "props". E.g. you may refer to this link: https://reactjs.org/blog/2017/09/08/dom-attributes-in-react-16.html for more clarification.
I have undertaken a project which will extract the main content from any webpage. For example, if I input the URL of any news article, it will return the article part only. The first step would be getting the source code of the given URL. There are many ways to do it. After getting HTML code of given webpage, I will keep the part inside <body> tag because obviously article will be somewhere inside body.
After this, I am selecting each div element and checking how much text it contains. At end I am selecting the div with most text inside it.
Other way I am thinking is, for each <p> element, I will check the parent of it. At end, I will select the div which has most <p> child directly. To understand it better check this tree- Tree of an HTML
Now I know that these methods are the basic and that's why I am asking this question. I want to know the suggestions of the community about this. What approaches you all use?
I like the idea of implementing your own 'News' crawler...
A few suggestions:
Check the source ('Right Click' > 'Inspect' at chrome) of some popular sites (e.g. The New York Times); search for common html object names, ids or classes they use to identify the different blocks in the html; for instance: divs with 'story' or 'story-body' ids.
I would go with the word count, but also use a dictionary of common phrases, which are likely to appear in a news article.
I would search for the block within 'header' and 'footer', excluding comments section or advertisements (again, by searching the values of the object id or class names).
Start your crawling from the main page, it will probably have references to the sub pages or articles - once you have the reference (e.g. a header or article name), it will help you navigate in the sub page itself.
In any case, I suggest working with java jsoup library - it will make your life easier; use it with the jquery-like selectors.
Goodluck.
I'm using PJAX with cakePHP. Everything works super fine, but since I'm not reloading the layout, I don't get title update. I was told I had to put a tag in the body, and that it would get removed. It seems to work but, is it valid to have an HTML page without a tag ?
EDIT : well actually the tag isn't removed, so HTML markup is invalid! What is the best practice for this? It would need to be the same for metas.
The official demo uses this in Ruby but I don't read it :
https://github.com/defunkt/jquery-pjax/blob/heroku/app/pjax.rb
https://github.com/defunkt/jquery-pjax/blob/heroku/app/views/layout.erb
Since #57 pjax also looks for a data attribute data-title in the fragment that is loaded and should update the main title.
This is much cleaner and would not break html with a title in the body.
I have a number of templates that create headings based on a formula. I am wondering if there is anyway to create an "edit" link that will take you directly to that section? The way that it currently works, the edit link takes you to editing the template itself. Could I possibly create a customized link that would keep you on the page and take you to right part?
Here is some sample code to help clear things up...
Template:Head:
==={{{1}}}===
This is a heading titled "{{{1}}}"
Test Page:
=Section 1=
{{head|1.1}}
{{head|1.2}}
{{head|1.3}}
=Section 2=
{{head|2.1}}
{{head|2.2}}
{{head|2.3}}
At the moment, if I want to edit the information for template "2.3", I have to edit all of section 2. (Note that for this example, that isn't a big deal. For the actual templates I am working with on my site, the templates have dozens of parameters and there are sometimes 10 or more in a section.)
Bottom line, is there way to create a custom edit link inside of the {{head}} template that would take you directly to editing the templates call on the page "Test Page"? Hope that makes sense.
Edit: Is there perhaps a way to make use of "anchor" tags? Can anchors be passed in to the URL?
To restate your problem, when you transclude a section heading the header isn't treated as being part of the destination page, so the edit link takes you back to the source. So you need a separate container for the template in order to edit it individually, and a complete section is the smallest editable container.
The only way I can think of doing this is using subpages (or virtual subpages if you don't have that ennabled in this namespace, doesn't change anything). So instead of placing {{head|1.1}} on MyPage, put it on MyPage/Subpage1 and then transclude that into MyPage in the usual way ({{:MyPage/Subpage1}}).
{{head}} can then include a custom edit link to the template input by using HTML heading tags (<h2> is equal to ==, etc.) to suppress the standard edit link and then use one of these templates (probably {{ed right}}) to create a custom edit link pointing to MyPage/Subpage1.
The way to create anchors in Mediawiki, by the way, is to use a <span id="name"/> tag, but that doesn't create a container that can be edited (or at least, not that I've been able to work out through URL tinkering).
I'm pretty sure there's no way to do that. As far as MediaWiki's section editing feature is concerned, the only thing that begins a new section is a line of the form:
=== Some text here ===
with the number of = signs determining the level of the heading. There's no way to get MediaWiki to let you edit any segment of the document that doesn't begin and end with such a line (or the beginning or end of the page).
Well, OK, I'm sure you technically could do it with an extension, in the sense that you can do anything with a MediaWiki extension. All you'd need to do is provide some way (e.g. a special parameter in an edit URL) for to user to indicate "I want to edit this template", then extract the template from the wikitext, present it to the user for editing, and write the result back into the page text over the original.
The tricky part will be extracting the template from the page source. (Finding and replacing templates on a page is a fairly common task for MediaWiki bot writers, so you might want to look for ideas there.) Whatever method you end up using for that, there will probably be edge cases where you need to give up and tell the user "Sorry, but I can't figure out how that template is transcluded here."
I'd like to express in an HTML document what kind of document is pointed by an anchor tag (<a>). For example, is it a list of dates, or a list of people, etc... All referenced documents will be Atom feeds, but the links will be displayed differently based on what the feed contains.
I see 2 options :
using the "rel" attribute : this attribute is supposed to contains the relation between the current document and the referenced document. I don't think this is an optimal solution as this attribute is supposed to define the relation and not really the content. The referenced document will be a list of dates for all documents referencing it.
using the "type" attribute : this attribute is supposed to contains the content type of the referenced document. This solution seems closer to what I try to achieve, but this attribute should contains a content type and not a more generic description of the link.
Which solution would you recommend ? Do you see a cleaner way to achieve the same result ?
Perhaps something like microformats will help?
Use the class attribute, since your intent is make them appear different this would seem to be the best choice.
title attribute on a link allows you to give the link a title which is displayed when it's hovered.
That might be what you want.